...

View Full Version : JS Adding Numbers and Displaying Total



SteveSensei
04-30-2008, 11:19 PM
I have a form with 2 radio boxes and a checkbox. The values of each are numbers. I would like to be able to select 1 of the 2 radio boxes and add the number to the number in the checkbox if it is checked:

<form>
<input type="radio" name="conferenceRate" value="250"> Three-day Conference Package - Member
<input type="radio" name="conferenceRate" value="296"> Three-day Conference Package - Non-member rate

<input type="checkbox" name="mealRate" value="180">Attendant Meal package
</form>

The resulting total would be passed to the page and displayed, and also passed to amount field of a Paypal button.

Any help on this would be greatly appreciated

mjlorbet
05-01-2008, 12:01 AM
function doAdd(){
return document.getElementsByName("conferenceRate")[0].checked?document.getElementsByName("conferenceRate")[0].value:document.getElementsByName("conferenceRate")[1].value + document.getElementsByName("mealRate")[0].checked?document.getElementsByName("mealRate")[0].value:0;
}
window.onload = function(){document.form.mysubmitbutton.onclick = function(){
document.getElementsByName("hdnField")[0].value = doAdd();};};
}

would get added inside script tags in the head element of your document



<input type="hidden" name="hdnField" value="" />
<input type="submit" id="mysubmitbutton" />

would get added inside your form tags, all that's left to do is set the method and action on your form to the next page. you'll have all the information ready to be extracted, but the way to do it is usually through a server side language.

SteveSensei
05-01-2008, 05:25 PM
Many thanks for the help, but I couldn't get it to work:

http://www.worldfest.net/ihss/register.asp

Steve

Philip M
05-01-2008, 06:01 PM
<form name = "myForm">
<input type="radio" name="conferenceRate" value="250"> Three-day Conference Package - Member <br>
<input type="radio" name="conferenceRate" value="296"> Three-day Conference Package - Non-member rate<br><br>
<input type="checkbox" name="mealRate" value="180">Attendant Meal package<br><br>
<input type = "button" value = "Calculate Total Cost" onclick = "calc()">
Your Total Cost <input type = "text" name = "result">
</form>

<script type = "text/javascript">

function calc() {
var total = 0;
if (document.myForm.conferenceRate[0].checked) {total = total + 250}
if (document.myForm.conferenceRate[1].checked) {total = total + 296}
if (document.myForm.mealRate.checked) {total = total + 180}
document.myForm.result.value = total;
}

</script>

If you wish to pass the result to another (different) page then you can best use a cookie.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum