multiplying two dropdown menu values

[sz473390560]

Hi I am pretty new to Japascript, and have been trying to multiply the values of two dropdown menus

<td><form action="index.php?c=ref">
<select id="RLA" name="RLA" size="1" onchange="totalA(this.value);" >
<option value="">...</option>
<option value="10">10</option>
<option value="20">20</option>
<option value="30">30</option>
<option value="40">40</option>
</select>
<select id="RLB" name="RLB" size="1" onchange="totalB(this.value);">
<option value="">Choose One...</option>
<option value="0.55">x4 @ $0.55 each</option>
<option value="1.00">x8 @ $1.00</option>
<option value="1.30">x13 @ $1.30</option>
</select>
<input type="button" class="butt2" value="Buy Now" />
</form></td>
<td>Total: <input id="show" name="show" type="text" value="$0.00" size="3" /></td>


The Javascript that is supposed to work with it is

var numA = 0;
function totalA(valA) {
if (valA && document.getElementById(valA)) {
numA = eval(valA);
}
}

var numB = 0;
function totalB(valB) {
if (valB && document.getElementById(valB)) {
numB = eval(valB);
}
}
var tots = "$" + (numA * numB);
document.write("show").value = "$" + tots;


I have searched the web, exhausted my brain and am ready to have an aneurysm.
Basically I am trying to show the value of the selected two options before purchase.
Can someone help me?

[Justin Nemeth]

Try this code. Basically, you have to access the values for a select list a little different than with a basic input field. And to set the value, you would use document.getElementById('show') to get a reference to your text field.


<td><form action="index.php?c=ref">
<select id="RLA" name="RLA" size="1" onchange="totalA(this);" >
<option value="">...</option>
<option value="10">10</option>
<option value="20">20</option>
<option value="30">30</option>
<option value="40">40</option>
</select>
<select id="RLB" name="RLB" size="1" onchange="totalB(this);">
<option value="">Choose One...</option>
<option value="0.55">x4 @ $0.55 each</option>
<option value="1.00">x8 @ $1.00</option>
<option value="1.30">x13 @ $1.30</option>
</select>
<input type="button" class="butt2" value="Buy Now" />
</form></td>
<td>Total: <input id="show" name="show" type="text" value="$0.00" size="3" /></td>


var numA = 0;
function totalA(selectA) {
if (selectA && selectA.selectedIndex) {
numA = selectA.options[selectA.selectedIndex].value;
}
}

var numB = 0;
function totalB(selectB) {
if (selectB && selectB.selectedIndex) {
numB = selectB.options[selectB.selectedIndex].value;
}
}

var tots = numA * numB;
document.getElementById("show").value = "$" + tots;


-justin

[sz473390560]

Thanks for the suggestion.
After a good night's sleep and squeezing my brain of every last drop I magically made it work.
Using the following html:
<td><form action="index.php?c=ref">
<select id="RLA" name="RLA" size="1" onchange="totalA(this.value);" >
<option value="">...</option>
<option value="10">10</option>
<option value="20">20</option>
<option value="30">30</option>
<option value="40">40</option>
</select>
<select id="RLB" name="RLB" size="1" onchange="totalB(this.value);">
<option value="">Choose One...</option>
<option value="0.55">x4 @ $0.55 each</option>
<option value="1.00">x8 @ $1.00</option>
<option value="1.30">x13 @ $1.30</option>
</select>
<input type="button" class="butt2" value="Buy Now" />
</form></td>
<td>Total: <input id="showTB" name="showTB" type="text" value="$0.00" size="3" /></td>

with script:
var numA = 0;
function totalA(valA) {
if (valA) {
numA = Number(valA);
}
var tots = numB*numA;
document.getElementById("showTB").value = "$" + tots.toFixed(2);
}

var numB = 0;
function totalB(valB) {
if (valB) {
numB = Number(valB);
}
var tots = numB*numA;
document.getElementById("showTB").value = "$" + tots.toFixed(2);
}

By adding

var tots = numB*numA;
document.getElementById("showTB").value = "$" + tots.toFixed(2);

to both functions makes it work for changes in both dropdown menus and adds 2 decimal points.
For anyone else who wants to do that.

Simple is best :)