Hello All,
I've almost got this one licked, but I need some Javascript help.
I have a membership form:
http://www.carbonecon.com/index.php?option=com_rsform&formId=12
What I need is to amend the calculateTotal() function to:
(a) recognize what box is checked
(b) calculate the total based on what category of membership is selected.
(c) three of the categories can just total using the checkbox value
(d) the other two need the formula
How can I modify my functon to accomodate the simple checkboxes?
Is best practice here if...else statements, or should I use a Switch statement?
Here's my form code (note the calculateTotal() function):
<script type="text/javascript">
function enableQuantity(prod,quantity)
{
if(document.getElementById(prod).checked)
document.getElementById(quantity).disabled = false;
else
document.getElementById(quantity).disabled = true;
}
function calculateTotal()
{
var products = new Array("Membership10","Membership20","Membership30","Membership40","Membership50"); // these are ID's
var i=0;
var total = 0;
for(i;i<products.length;i++)
if(document.getElementById(products[i]).checked)
{
//alert(document.getElementById("QuantityProd"+(i+1)).value);
total = total + parseInt(document.getElementById(products[i]).value) + (parseInt(document.getElementById('QuantityMem'+(i+1)).value)*.5);
}
document.getElementById('Total1').value = total;
}
</script>
<div class="componentheading">{global:formtitle}</div>
{error}
<table border="0">
<tr>
<td>{Membership1:body}<div class="formClr"></div>{Membership1:validation}</td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td>{Membership2:body}<div class="formClr"></div>{Membership2:validation}</td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td>{Membership3:body}<div class="formClr"></div>{Membership3:validation}</td>
<td>{QuantityMem3:caption}</td>
<td>{QuantityMem3:body}<div class="formClr"></div>{QuantityMem3:validation}</td>
<td>{QuantityMem3:description}</td>
</tr>
<tr>
<td>{Membership4:body}<div class="formClr"></div>{Membership4:validation}</td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td>{Membership5:body}<div class="formClr"></div>{Membership5:validation}</td>
<td>{QuantityMem5:caption}</td>
<td>{QuantityMem5:body}<div class="formClr"></div>{QuantityMem5:validation}</td>
<td>{QuantityMem5:description}</td>
</tr>
<tr>
<td> </td>
<td>{Calculate:caption}</td>
<td>{Calculate:body}<div class="formClr"></div>{Calculate:validation}</td>
<td>{Calculate:description}</td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td align="right">Membership Total - {Total1:body}<div class="formClr"></div>{Total1:validation}.00 USD</td>
</tr>
</table>
<script type="text/javascript">
enableQuantity('Membership30','QuantityMem3');
enableQuantity('Membership50','QuantityMem5');
</script>
