Change text box value based on drop down value selected

diesel12

09-29-2009, 09:59 PM

The form below is a simple checkout form with a select box that allows users to choose the number of email accounts they want when they check out of our website and posts the user's drop down selection's value to the url string via get.

The number of email accounts are 1, 3, and 6 email accounts. I'm trying to assign a dollar value to each option that will display in a text box (it says $TBA in example below) depending on the user's choice from select box.

Example: User chooses 1 email box, so $5 displays where $TBA is or user chooses 6 email accounts and $10 displays where $TBA is.... we just want the $TBA to change to reflect the cost of the email accounts based on the user's chosen number of email accounts from drop down select box....

Any feedback on how to accomplish this is appreciated!

<form action="/accounts/cart.php" method="get">
<table class="comparison pricing-email" border="0" cellspacing="1" cellpadding="0" width="100%">
<tbody>
<tr class="row1">
<td class="col1">Choose # of EMAIL accounts:</td>
<td>
<select style="width: 60px; font-size: 17px;" name="a=add"> <option value="1">1</option> <option value="3">3</option> <option value="4">6</option> </select>
</td>
<td></td>
</tr>
<tr class="row1">
<td class="col1">Per Month:</td>
<td>$TBA</td>
<td>
<input type="image" src="/wp-content/themes/leadpress/images/sign-up.png" alt="Sign Up" /></input>
</td>
</tr>
</tbody>
</table>
</form>

mlseim

09-29-2009, 10:06 PM

Is a page refresh OK, or are you planning on using some Javascripting along with PHP?

You might want to post this in the Javascripting section?

diesel12

09-29-2009, 10:09 PM

Great question. The answer is I don't know.... I suspected that javascript may be necessary... but am not really sure.... am not familiar with refresh or javascript in terms of writing the necessary code.... Does it look like one of these will be necessary to achieve our goal?

mlseim

09-30-2009, 03:08 AM

Below is my shot at it ....
I'm no Javascript expert though.
The result (price) ends-up in a text box, but maybe it doesn't have to be? not sure.

Maybe enough there to get some ideas ... again, you should ask the JS experts.

Copy and save this as "test.html" and open it with your browser to test it out...

<html>
<head>
</head>
<script type="text/javascript">
function addit(){
if(document.getElementById("add").value=="1")
{
document.getElementById("amount").value="$5.00"
}
if(document.getElementById("add").value=="3")
{
document.getElementById("amount").value="$10.00"
}
if(document.getElementById("add").value=="6")
{
document.getElementById("amount").value="$15.00"
}
}
</script>
<body>
<form action="/accounts/cart.php" method="get">
<table class="comparison pricing-email" border="0" cellspacing="1" cellpadding="0" width="30%">
<tbody>
<tr class="row1">
<td class="col1">Choose # of EMAIL accounts:  
<select style="width: 60px; font-size: 17px;" name="add" id="add" onChange="addit()">
<option value="1">1</option>
<option value="3">3</option>
<option value="6">6</option>
</select>
</td>
</tr>
<tr class="row1">
<td class="col1">Per Month: <input type="text" id="amount" value="" style="border:none; font-size:13pt;"></td>
</tr><tr>
<td>
<input type="submit" name="submit" value="Sign-Up">
</td>
</tr>
</tbody>
</table>
</form>
</body>
</html>

diesel12

09-30-2009, 05:15 AM

MSELM,

I truly appreciate your willingness to help me out with this! It is greatly appreciated!!!

Thanks,

Trace

Flinchyyy

10-27-2010, 01:33 AM

Now would if i wanna add another row how do i make it add on to it

Flinchyyy

10-27-2010, 01:39 AM

And have them add together

mlseim

10-27-2010, 01:48 AM

I don't know what "row" means ...

row, column, another text box ????

Flinchyyy

10-27-2010, 01:49 AM

like how do i add another drop down box that wil make it so it adds to the total price