Form totalling not working in IE

Hi Guys,

Further to a thread I started yesterday, I have managed to get my form working (totalling some user-selected options) and I thought all was good in the world. That it until I tested in in IE. It doesn’t work. fine in Chrome, Firefox, Safari etc.

Any ideas?

<script type=“text/javascript”>
function enableQuantity(prod,quantity)
{
if(document.getElementById(prod).checked)
document.getElementById(quantity).disabled = false;

else
	document.getElementById(quantity).disabled = true;

calculateTotal();

}

function calculateTotal()
{

var products = new Array(“Product10”,“Product20”,“Product30”,“Product40”,“Product50”,“Product60”,“Product70”,“Product80”);
var extraday = new Array(“extra10”,“extra20”,“extra30”,“extra40”,“extra50”,“extra60”,“extra70”,“extra80”);
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('extra'+(i+1)).value) * (parseInt(Days.value) - 1))) * parseInt(document.getElementById('QuantityProd'+(i+1)).value));

	}
document.getElementById('Total').value = total;

}
</script>

HTML:

<h2>{global:formtitle}</h2>
{error}
<!-- Do not remove this ID, it is used to identify the page so that the pagination script can work correctly -->
<fieldset class="formHorizontal formContainer" id="rsform_5_page_0">
	<div class="Section">{header:body}</div>

	<div class="rsform-block rsform-block-date">
		<div class="formControlLabel">{Date:caption}<strong class="formRequired">*</strong></div>
		<div class="formControls">
			<div class="formBody">{Date:body}<span class="formValidation">{Date:validation}</span></div>
			<p class="formDescription">{Date:description}</p>
		</div>
	</div>
	<div class="rsform-block rsform-block-days">
		<div class="formControlLabel">{Days:caption}</div>
		<div class="formControls">
		<div class="formBody">{Days:body}<span class="formValidation">{Days:validation}</span></div>
		<p class="formDescription">{Days:description}</p>
		</div>
	</div>
	<div class="rsform-block rsform-block-hub">
		<div class="formControlLabel">{Hub:caption}</div>
		<div class="formControls">
		<div class="formBody">{Hub:body}<span class="formValidation">{Hub:validation}</span></div>
		<p class="formDescription">{Hub:description}</p>
		</div>
	</div>

	
	<div class="Section">{header2:body}</div>
	
	
	
	<div class="rsform-block rsform-block-product1">
		<div class="bike_left">
			<div class="check">{Product1:body}<span class="formValidation">{Product1:validation}</span></div>
			<div class="chec_desc">{Product1:description}</div>
		</div>
		
		<div class="bike_right">
			<div class="formControlLabel">{QuantityProd1:caption}</div>
			<div class="formControls">
				<div class="formBody">{QuantityProd1:body}<span class="formValidation">{QuantityProd1:validation}</span></div>
			</div>
		</div>
	</div>
	
	<div class="rsform-block rsform-block-product2">
		<div class="bike_left">
			<div class="check">{Product2:body}<span class="formValidation">{Product2:validation}</span></div>
			<div class="chec_desc">{Product2:description}</div>
		</div>
		
		<div class="bike_right">
			<div class="formControlLabel">{QuantityProd2:caption}</div>
			<div class="formControls">
				<div class="formBody">{QuantityProd2:body}<span class="formValidation">{QuantityProd2:validation}</span></div>
			</div>
		</div>
	</div>
	
	<div class="rsform-block rsform-block-product3">
		<div class="bike_left">
			<div class="check">{Product3:body}<span class="formValidation">{Product3:validation}</span></div>
			<div class="chec_desc">{Product3:description}</div>
		</div>
		
		<div class="bike_right">
			<div class="formControlLabel">{QuantityProd3:caption}</div>
			<div class="formControls">
				<div class="formBody">{QuantityProd3:body}<span class="formValidation">{QuantityProd3:validation}</span></div>
			</div>
		</div>
	</div>

	<div class="rsform-block rsform-block-product4">
		<div class="bike_left">
			<div class="check">{Product4:body}<span class="formValidation">{Product4:validation}</span></div>
			<div class="chec_desc">{Product4:description}</div>
		</div>
		
		<div class="bike_right">
			<div class="formControlLabel">{QuantityProd4:caption}</div>
			<div class="formControls">
				<div class="formBody">{QuantityProd4:body}<span class="formValidation">{QuantityProd4:validation}</span></div>
			</div>
		</div>
	</div>

	<div class="rsform-block rsform-block-product5">
		<div class="bike_left">
			<div class="check">{Product5:body}<span class="formValidation">{Product5:validation}</span></div>
			<div class="chec_desc">{Product5:description}</div>
		</div>
		
		<div class="bike_right">
			<div class="formControlLabel">{QuantityProd5:caption}</div>
			<div class="formControls">
				<div class="formBody">{QuantityProd5:body}<span class="formValidation">{QuantityProd5:validation}</span></div>
			</div>
		</div>
	</div>

	<div class="rsform-block rsform-block-product6">
		<div class="bike_left">
			<div class="check">{Product6:body}<span class="formValidation">{Product6:validation}</span></div>
			<div class="chec_desc">{Product6:description}</div>
		</div>
		
		<div class="bike_right">
			<div class="formControlLabel">{QuantityProd6:caption}</div>
			<div class="formControls">
				<div class="formBody">{QuantityProd6:body}<span class="formValidation">{QuantityProd6:validation}</span></div>
			</div>
		</div>
	</div>

	<div class="rsform-block rsform-block-product7">
		<div class="bike_left">
			<div class="check">{Product7:body}<span class="formValidation">{Product7:validation}</span></div>
			<div class="chec_desc">{Product7:description}</div>
		</div>
		
		<div class="bike_right">
			<div class="formControlLabel">{QuantityProd7:caption}</div>
			<div class="formControls">
				<div class="formBody">{QuantityProd7:body}<span class="formValidation">{QuantityProd7:validation}</span></div>
			</div>
		</div>
	</div>

	<div class="rsform-block rsform-block-product8">
		<div class="bike_left">
			<div class="check">{Product8:body}<span class="formValidation">{Product8:validation}</span></div>
			<div class="chec_desc">{Product8:description}</div>
		</div>
		
		<div class="bike_right">
			<div class="formControlLabel">{QuantityProd8:caption}</div>
			<div class="formControls">
				<div class="formBody">{QuantityProd8:body}<span class="formValidation">{QuantityProd8:validation}</span></div>
			</div>
		</div>
	</div>	
	
	
	<div class="rsform-block rsform-block-extra1">
		<div class="formControlLabel">{extra1:caption}</div>
		<div class="formControls">
		<div class="formBody">{extra1:body}<span class="formValidation">{extra1:validation}</span></div>
		<p class="formDescription">{extra1:description}</p>
		</div>
	</div>
	<div class="rsform-block rsform-block-extra2">
		<div class="formControlLabel">{extra2:caption}</div>
		<div class="formControls">
		<div class="formBody">{extra2:body}<span class="formValidation">{extra2:validation}</span></div>
		<p class="formDescription">{extra2:description}</p>
		</div>
	</div>
	<div class="rsform-block rsform-block-extra3">
		<div class="formControlLabel">{extra3:caption}</div>
		<div class="formControls">
		<div class="formBody">{extra3:body}<span class="formValidation">{extra3:validation}</span></div>
		<p class="formDescription">{extra3:description}</p>
		</div>
	</div>
	<div class="rsform-block rsform-block-extra4">
		<div class="formControlLabel">{extra4:caption}</div>
		<div class="formControls">
		<div class="formBody">{extra4:body}<span class="formValidation">{extra4:validation}</span></div>
		<p class="formDescription">{extra4:description}</p>
		</div>
	</div>
	<div class="rsform-block rsform-block-extra5">
		<div class="formControlLabel">{extra5:caption}</div>
		<div class="formControls">
		<div class="formBody">{extra5:body}<span class="formValidation">{extra5:validation}</span></div>
		<p class="formDescription">{extra5:description}</p>
		</div>
	</div>
	<div class="rsform-block rsform-block-extra6">
		<div class="formControlLabel">{extra6:caption}</div>
		<div class="formControls">
		<div class="formBody">{extra6:body}<span class="formValidation">{extra6:validation}</span></div>
		<p class="formDescription">{extra6:description}</p>
		</div>
	</div>
	<div class="rsform-block rsform-block-extra7">
		<div class="formControlLabel">{extra7:caption}</div>
		<div class="formControls">
		<div class="formBody">{extra7:body}<span class="formValidation">{extra7:validation}</span></div>
		<p class="formDescription">{extra7:description}</p>
		</div>
	</div>
	<div class="rsform-block rsform-block-extra8">
		<div class="formControlLabel">{extra8:caption}</div>
		<div class="formControls">
		<div class="formBody">{extra8:body}<span class="formValidation">{extra8:validation}</span></div>
		<p class="formDescription">{extra8:description}</p>
		</div>
	</div>
	<div class="rsform-block rsform-block-total">
		<div class="formControlLabel">{Total:caption}</div>
		<div class="formControls">
		<div class="formBody">{Total:body}<span class="formValidation">{Total:validation}</span></div>
		<p class="formDescription">{Total:description}</p>
		</div>
	</div>
	<div class="rsform-block rsform-block-continue">
		<div class="formControlLabel">&nbsp;</div>
		<div class="formControls">
		<div class="formBody">{Continue:body}</div>
		</div>
	</div>
	</fieldset>
<!-- Do not remove this ID, it is used to identify the page so that the pagination script can work correctly -->
<fieldset class="formHorizontal formContainer" id="rsform_5_page_1">
	<div class="rsform-block rsform-block-bookingref">
		<div class="formControlLabel">{BookingRef:caption}</div>
		<div class="formControls">
		<div class="formBody">{BookingRef:body}<span class="formValidation">{BookingRef:validation}</span></div>
		<p class="formDescription">{BookingRef:description}</p>
		</div>
	</div>
	
	
		<div class="Section">{header3:body}</div>
	
	<div class="rsform-block rsform-block-fullname">
		<div class="formControlLabel">{Fullname:caption}<strong class="formRequired">*</strong></div>
		<div class="formControls">
		<div class="formBody">{Fullname:body}<span class="formValidation">{Fullname:validation}</span></div>
		<p class="formDescription">{Fullname:description}</p>
		</div>
	</div>
	<div class="rsform-block rsform-block-phone">
		<div class="formControlLabel">{Phone:caption}</div>
		<div class="formControls">
		<div class="formBody">{Phone:body}<span class="formValidation">{Phone:validation}</span></div>
		<p class="formDescription">{Phone:description}</p>
		</div>
	</div>
	<div class="rsform-block rsform-block-mobile">
		<div class="formControlLabel">{Mobile:caption}<strong class="formRequired">*</strong></div>
		<div class="formControls">
		<div class="formBody">{Mobile:body}<span class="formValidation">{Mobile:validation}</span></div>
		<p class="formDescription">{Mobile:description}</p>
		</div>
	</div>
	<div class="rsform-block rsform-block-email">
		<div class="formControlLabel">{Email:caption}<strong class="formRequired">*</strong></div>
		<div class="formControls">
		<div class="formBody">{Email:body}<span class="formValidation">{Email:validation}</span></div>
		<p class="formDescription">{Email:description}</p>
		</div>
	</div>
	<div class="rsform-block rsform-block-home-address">
		<div class="formControlLabel">{Home address:caption}</div>
		<div class="formControls">
		<div class="formBody">{Home address:body}<span class="formValidation">{Home address:validation}</span></div>
		<p class="formDescription">{Home address:description}</p>
		</div>
	</div>
	<div class="rsform-block rsform-block-visiting-address">
		<div class="formControlLabel">{Visiting address:caption}</div>
		<div class="formControls">
		<div class="formBody">{Visiting address:body}<span class="formValidation">{Visiting address:validation}</span></div>
		<p class="formDescription">{Visiting address:description}</p>
		</div>
	</div>

	<div class="rsform-block rsform-block-submit">
		<div class="formControlLabel">{Submit:caption}</div>
		<div class="formControls">
		<div class="formBody">{Submit:body}<span class="formValidation">{Submit:validation}</span></div>
		<p class="formDescription">{Submit:description}</p>
		</div>
	</div>
</fieldset>
<script type="text/javascript">
enableQuantity('Product10','QuantityProd1');
enableQuantity('Product20','QuantityProd2');
enableQuantity('Product30','QuantityProd3');
enableQuantity('Product40','QuantityProd4');
enableQuantity('Product50','QuantityProd5');
enableQuantity('Product60','QuantityProd6');
enableQuantity('Product70','QuantityProd7');
enableQuantity('Product80','QuantityProd8');
</script>

Change
if(document.getElementById(prod).checked)
to
if(document.getElementById(prod).checked == true)

And
if(document.getElementById(products[i]).checked)
to
if(document.getElementById(products[i]).checked == true)

Didn’t seem to make a difference unfortunately…?

<script type="text/javascript">
function enableQuantity(prod,quantity)
{
	if(document.getElementById(prod).checked == true)
		document.getElementById(quantity).disabled = false;

	else
		document.getElementById(quantity).disabled = true;
calculateTotal();		
	
}

function calculateTotal()
{
	
var products = new Array("Product10","Product20","Product30","Product40","Product50","Product60","Product70","Product80");
var extraday = new Array("extra10","extra20","extra30","extra40","extra50","extra60","extra70","extra80");
	var i=0;
	var total = 0;
	for(i;i<products.length;i++)
		if(document.getElementById(products[i]).checked == true)
		{
		
			//alert(document.getElementById("QuantityProd"+(i+1)).value);
			total  = total + ((parseInt(document.getElementById(products[i]).value) + (parseInt(document.getElementById('extra'+(i+1)).value) * (parseInt(Days.value) - 1))) * parseInt(document.getElementById('QuantityProd'+(i+1)).value));

		}
	document.getElementById('Total').value = total;
}
</script>

Solved. Apparently IE didn’t like that Days was undefined

total = total + ((parseInt(document.getElementById(products[i]).value) + (parseInt(document.getElementById('extra'+(i+1)).value) * (parseInt(document.getElementById('Days').value) - 1))) * parseInt(document.getElementById('QuantityProd'+(i+1)).value));