Sending Javascript variables

Question

I have a page that allows a user to choose some things in a form and it will calculate the weight using javascript. It breaks it up into 5 variables that I need to send to another page. Originally I was just having it put the variable into a text box and then I was posting that text box. However I dont want to have 5 text boxes. So now I need to somehow send or post the five variables to another page. Here is my javascript function. I need to post weightBoxOne - weightBoxFive

js function

function getWeight(){
      var weightBoxOne;
      var weightBoxTwo;
      var totalWeight;
      var box = .5;
   var quantity = document.dhform.quantity.value;
   var cardSize = document.dhform.cardSize.value;
   if(cardSize == 0.0141){
    if(quantity <= 1000){
     weightBoxOne = (quantity * cardSize) + box;
     totalWeight = weightBoxOne;
    }else if(quantity > 1000 && quantity <= 2000){
     weightBoxOne = (1000 * cardSize) + box;
     weightBoxTwo = ((quantity - 1000) * cardSize) + box;
     totalWeight = weightBoxOne + weightBoxTwo;
    }else if(quantity > 2000 && quantity <= 3000){
     weightBoxOne = (1000 * cardSize) + box;
     weightBoxTwo = (1000 * cardSize) + box;
     weightBoxThree = ((quantity - 2000) * cardSize) + box;
     totalWeight = weightBoxOne + weightBoxTwo + weightBoxThree; 
    }else if(quantity > 3000 && quantity <= 4000){
     weightBoxOne = (1000 * cardSize) + box;
     weightBoxTwo = (1000 * cardSize) + box;
     weightBoxThree = (1000 * cardSize) + box;
     weightBoxFour = ((quantity - 3000) * cardSize) + box;
     totalWeight = weightBoxOne + weightBoxTwo + weightBoxThree + weightBoxFour;
    }else{
     weightBoxOne = (1000 * cardSize) + box;
     weightBoxTwo = (1000 * cardSize) + box;
     weightBoxThree = (1000 * cardSize) + box;
     weightBoxFour = (1000 * cardSize) + box;
     weightBoxFive = ((quantity - 4000) * cardSize) + box;
     totalWeight = weightBoxOne + weightBoxTwo + weightBoxThree + weightBoxFour + weightBoxFive;
    }
   }else if(cardSize == 0.00949){
    if(quantity <= 4000){
     weightBoxOne = (quantity * cardSize) + box;
     totalWeight = weightBoxOne;
    }else{
     weightBoxOne = (4000 * cardSize) + box;
     weightBoxTwo = ((quantity - 4000) * cardSize) + box;
     totalWeight = weightBoxOne + weightBoxTwo;
    }
   }
   document.rates.weight.value = totalWeight;
  }
  //-->

this is the form that was originally posting

<form action="getRates.php" name="rates" method="post" onSubmit="popupform(this, 'join')">
                          <table style="width: 216px">
                            <tr>
                              <td style="width: 115px; height: 49px;"><span class="style16">Weight</span><br/>
                                  <input type="text" id="weight" name="weight" size="10" maxlength="4"/>
                              </td>
                              <td align="right" style="width: 68px; height: 49px;" valign="top"><span class="style16">Zip Code</span><br/>
                                  <input type="text" id="zip" name="zip" size="10" maxlength="5"/>
                              </td>
                            </tr>
                            <tr>
                              <td style="width: 115px">
         <input name="submit" type="submit" value="Get Rate Costs" style="width: 138px" />

just set up a quick json web service and use jquery's post function, or some other popular ajax framework (jquery is the best though) — mike clagg
– mike clagg, Commented May 10, 2010 at 17:43
... can't you use an array instead of weightBoxNineThousand? — kennytm
– kennytm, Commented May 10, 2010 at 17:43

EAMann · Accepted Answer · 2010-05-10 17:49:25Z

1

I've done a similar thing by passing the JavaScript variables into hidden fields and posting them in the form as usual.

Just add a few hidden fields to your form with tags like this:

<input type="hidden" id="hidden-field-1" value="">

Then you can adjust the value of the hidden field to match your JavaScript variable and pass the value on to the next page:

document.rates.hidden-field-1.value = totalWeight;

Just keep in mind that this form of JavaScript (which I took directly from your post) will only work reliably in Internet Explorer ... A better way would be to use:

document.forms['rates'].hidden-field-1.value = totalWeight;

answered May 10, 2010 at 17:49

EAMann

4,1462 gold badges31 silver badges49 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Jason S · Accepted Answer · 2010-05-10 17:54:16Z

0

Ignoring the fact that you could hack this to work with small numbers of variables, and assuming you control both the client Javascript and the receiving page on the server

Use an array instead of different variables when you should use an array
Serialize the array to a string using JSON
Post the string to your receiving page on the server in a form field (hidden or otherwise)
Deserialize the JSON string to an array
use it on the server

answered May 10, 2010 at 17:54

Jason S

191k176 gold badges637 silver badges1k bronze badges

Collectives™ on Stack Overflow

Sending Javascript variables

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related