My javascript skills have always stunk. I have a bunch of textboxes that I need to total up and insert the value of into another onChange and I'm not sure where to begin.

I need to integrate this with a shopping cart so I don't have any choice in naming the fields.

Sample textboxes that need to be totalled are:
<input type="text" size="2" name="option|white|TDG11" >WHITE<br>
<input type="text" size="2" name="option|black|TDG11">BLACK<br>
<input type="text" size="2" name="option|lt grey|TDG11">LT GREY<br>

(they're product colors and the text box indicates how many of each color).

The box that needs to get the total of all the other boxes would look like:
<input type="text" name="item-TDG11|1:3.25,10:2.95,50:2.45|Gutermann Thread-1100 yards|-|-|" size=4>

If I can't get the total of all the option boxes into the main qty box, it won't calculate the qty discount correctly. Ideally, that qty box would be editable, but it has to be a form field to pass to the cart.

Any help, guidance or code samples would be greatly appreciated. My normal programmer dude is having roomate problems and couldn't help me and I'm on a time crunch to get this done.

Deb

ok, first of all, I reccomend giving all fields an ID; this won't affect how the form data is posted, don't worry! Use something like this;

<script language="Javascript">
function changeTotal() {
	if(document.getElementById) {
		if(!parseInt(document.getElementById("o_w_tdg11").value)) { document.getElementById("o_w_tdg11").value="0"; }
		if(!parseInt(document.getElementById("o_b_tdg11").value)) { document.getElementById("o_b_tdg11").value="0"; }
		if(!parseInt(document.getElementById("o_l_tdg11").value)) { document.getElementById("o_l_tdg11").value="0"; }
		
		nTotal = 0;
		nTotal += parseInt(document.getElementById("o_w_tdg11").value);
		nTotal += parseInt(document.getElementById("o_b_tdg11").value);
		nTotal += parseInt(document.getElementById("o_l_tdg11").value);
		document.getElementById("t_tdg11").value = nTotal;
	} else if(document.all) {
		if(!parseInt(document.all['o_w_tdg11'].value)) { document.all['o_w_tdg11'].value="0"; }
		if(!parseInt(document.all['o_b_tdg11'].value)) { document.all['o_b_tdg11'].value="0"; }
		if(!parseInt(document.all['o_l_tdg11'].value)) { document.all['o_l_tdg11'].value="0"; }

		nTotal = 0;
		nTotal += parseInt(document.all['o_w_tdg11'].value);
		nTotal += parseInt(document.all['o_b_tdg11'].value);
		nTotal += parseInt(document.all['o_l_tdg11'].value);
		document.all['t_tdg11'].value = nTotal;
	}
	return;
}
</script>

<input id="o_w_tdg11" value="0" onchange='changeTotal();' type="text" size="2" name="option|white|TDG11" >WHITE<br>
<input id="o_b_tdg11" value="0" onchange='changeTotal();' type="text" size="2" name="option|black|TDG11">BLACK<br>
<input id="o_l_tdg11" value="0" onchange='changeTotal();' type="text" size="2" name="option|lt grey|TDG11">LT GREY<br>

<input id="t_tdg11" type="text" name="item-TDG11|1:3.25,10:2.95,50:2.45|Gutermann Thread-1100 yards|-|-|" size=4>

Is there a cleaner way to do this with an array? Some of the products have 50 options and 3 or more products per page (which all need to be calculated separately). That's going to add significant bulk to the page.

An array of id's ? If thats what you mean, here is an example;

<script language="Javascript">
allIDs = new Array('o_w_tdg11','o_b_tdg11','o_l_tdg11');
function changeTotal() {
	if(document.getElementById) {
		for(i=0;i<allIDs.length;i++) { if(!parseInt(document.getElementById(allIDs[i]).value)) { document.getElementById(allIDs[i]).value="0"; } }

		nTotal = 0;
		for(i=0;i<allIDs.length;i++) { nTotal += parseInt(document.getElementById(allIDs[i]).value); }

		document.getElementById("t_tdg11").value = nTotal;
	} else if(document.all) {
		for(i=0;i<allIDs.length;i++) { if(!parseInt(document.all[allIDs[i]].value)) { document.all[allIDs[i]].value="0"; } }

		nTotal = 0;
		for(i=0;i<allIDs.length;i++) { nTotal += parseInt(document.all[allIDs[i]].value); }
		document.all['t_tdg11'].value = nTotal;
	}
	return;
}
</script>

<input id="o_w_tdg11" value="0" onchange='changeTotal();' type="text" size="2" name="option|white|TDG11" >WHITE<br>
<input id="o_b_tdg11" value="0" onchange='changeTotal();' type="text" size="2" name="option|black|TDG11">BLACK<br>
<input id="o_l_tdg11" value="0" onchange='changeTotal();' type="text" size="2" name="option|lt grey|TDG11">LT GREY<br>

<input id="t_tdg11" type="text" name="item-TDG11|1:3.25,10:2.95,50:2.45|Gutermann Thread-1100 yards|-|-|" size=4>

Thanks for your help.