Adding the value of drop down boxes [Archive]

View Full Version : Adding the value of drop down boxes

mikef729

05-18-2003, 04:07 PM

I plan on using 2 different drop down boxes on my site. The visitor could buy something from drop box one and possibly something from box 2. Each drop down box consist of 8 items, each with a different dollar value (ex. $1.00 $2.00 etc) Now I want to be able to add the dollar value of the first drop down box, with the value from the second drop down box. Any ideas?

cheesebagpipe

05-18-2003, 04:44 PM

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>buy stuff</title>
<script type="text/javascript" language="javascript">

var prices = {
'small thing' : '1.00' ,
'medium thing' : '2.99' ,
'gigantic thing' : '3.19' ,
'bad thing' : '7.33' ,
'badder thing': '24.99' ,
'empty box' : '3.00' //-----> no trailing comma after last!
}

function addem(oSelect1, oSelect2_id) {
var cost1, cost2, total, oSelect2 = document.getElementById(oSelect2_id);
cost1 = prices[oSelect1.options[oSelect1.selectedIndex].value] || '0';
cost2 = prices[oSelect2.options[oSelect2.selectedIndex].value] || '0';
total = parseFloat(cost1) + parseFloat(cost2);
document.getElementById('output').value = format(total);
}

function format(sAmount) {
sAmount = Math.round(sAmount * 100) / 100;
return '$' + ((sAmount != parseInt(sAmount)) ? sAmount : sAmount + '.00');
}

</script>
</head>
<body>
<form>
<select name="items1" id="item1" onchange="addem(this, 'item2')">
<option>buy stuff !</option>
<option value="small thing">small thing @ $1.00</option>
<option value="medium thing">medium thing @ $2.99</option>
<option value="gigantic thing">gigantic thing @ $3.19</option>
</select>
<select name="items2" id="item2" onchange="addem(this, 'item1')">
<option>buy more stuff !</option>
<option value="bad thing">bad thing @ $7.33</option>
<option value="badder thing">badder thing @ $24.99</option>
<option value="empty box">empty box @ $3.00</option>
</select>
<input type="text" name="output" id="output">_____total
</form>
</body>
</html>

RMDelete

01-16-2009, 04:32 AM

Okay, I know this thread is old as hell but I am a HUGE newb to coding. . . trying to learn but finding it hard. Just learned how to do PHP but java is totally chinese to me! :\ I ran a quick google search on this topic and this question was somewhat similar to what I wanted to do. Except I don't care for formatting prices and my needs would require 6 drop down boxes. So I was shocked to discover that the previous dude who asked this question was not even gracious enough to say "Thank you!" to Cheesebagpipe :\ and much less there was no follow up to say whether or not it worked.

So with the little knowledge I had I TRIED to modify the code to fit my needs but it just stops working. So from the original code and with what knowledge I didn't have I tried modifying it as such:

<script type="text/javascript" language="javascript">

var prices = {
'small thing' : '1.00' ,
'medium thing' : '2.99' ,
'gigantic thing' : '3.19' ,
'bad thing' : '7.33' ,
'badder thing': '24.99' ,
'empty box' : '3.00' ,
'empty thing' : '7.33' ,
'badder empty thing': '24.99' ,
'really empty box' : '3.00' //-----> no trailing comma after last!
}

function addem(oSelect1, oSelect2, oSelect3_id) {
var cost1, cost2, cost3, total, oSelect3 = document.getElementById(oSelect3_id);
cost1 = prices[oSelect1.options[oSelect1.selectedIndex].value] || '0';
cost2 = prices[oSelect2.options[oSelect2.selectedIndex].value] || '0';
cost3 = prices[oSelect3.options[oSelect3.selectedIndex].value] || '0';
total = (cost1) + (cost2) + (cost3);
document.getElementById('output').value = (total);
}

</script>;

<form>
<select name="items1" id="item1" onchange="addem(this, 'item2')">
<option>buy stuff !</option>
<option value="small thing">small thing @ $1.00</option>
<option value="medium thing">medium thing @ $2.99</option>
<option value="gigantic thing">gigantic thing @ $3.19</option>
</select>
<select name="items2" id="item2" onchange="addem(this, 'item1')">
<option>buy more stuff !</option>
<option value="bad thing">bad thing @ $7.33</option>
<option value="badder thing">badder thing @ $24.99</option>
<option value="empty box">empty box @ $3.00</option>
</select>
<select name="items3" id="item3" onchange="addem(this, 'item3')">
<option>buy MORE stuff !</option>
<option value="empty thing">empty thing @ $7.33</option>
<option value="badder empty thing">badder empty thing @ $24.99</option>
<option value=" really empty box">really empty box @ $3.00</option>
</select>
<input type="text" name="output" id="output">_____total
</form>

pretty much I was just trying to see if I could still get it to work... anyone mind or care to explain to a not so knowledgeable rookie girl how to read the code and what the hell I am doing wrong? (lol) Way to dig through the trash :)