In my form I have multiple line items. In a line item, the total price is found by multiplying the quantity by unit price. This is working fine. Under the line items, however, is the subtotal, which is suppose to be the sum of all the line item total prices. The javascript I’m currently using for the subtotal is fine if only one line item is entered. However, when I enter a quantity in the second line item it just adds a zero to the subtotal. Then I enter the price in line item 2 and the total price of that line item is concatenated to the subtotal. The second issue is if I go back and change line item 1, the subtotal is updated to show only the value of line item 1 total price. I guess my question is, what is the best method for keeping a running subtotal when the line item total price is updated?
The code I’ve used so far is below:
[CODE]<script>// <![CDATA[
function updateitem0() {
document.form.itemsum0.value = (document.form.quantityx.value) * (document.form.unitprice0.value);
document.form.subtotal.value = (document.form.itemsum0.value);
}
function updateitem1() {
document.form.itemsum1.value = (document.form.quantity1.value) * (document.form.unitprice1.value);
document.form.subtotal.value = (document.form.itemsum0.value + document.form.itemsum1.value);
}
// ]]></script>
[code=html]<h2>Requisition Form</h2>
<form action=”MPDF57/tester.php” method=”post” target=”_blank” name=”form”><fieldset><legend>Section 1</legend>
<p><label class=”field” for=”company_name”>Name of Company: </label> <input id=”company_name” class=”textbox” name=”company_name” type=”text” /></p>
<p><label class=”field” for=”address”>Address: </label> <textarea id=”address” cols=”38″ name=”address” rows=”2″></textarea></p>
<p><label class=”field” for=”telephone”>Telephone: </label> <input id=”telephone” class=”textbox” name=”telephone” type=”text” /></p>
<p><label class=”field” for=”fax2″>Fax: </label> <input id=”fax2″ class=”textbox” name=”fax2″ type=”text” /></p>
<p><label class=”field” for=”website”>Website: </label> <input id=”website” class=”textbox” name=”website” type=”text” /></p>
</fieldset><br /><fieldset><legend>Section 2</legend>
<table id=”requisitionitems” border=”0″>
<tbody>
<tr><th class=”width”>Quanity</th><th class=”width”>item #</th><th class=”width”>Description</th><th class=”width”>Unit Price</th><th class=”width”>Total Price</th></tr>
<tr>
<td><input id=”quantityx” class=”quantitywidth” name=”quantityx” type=”text” onChange=”updateitem0()”/></td>
<td><input id=”item0″ class=”itemwidth” name=”item0″ type=”text” /></td>
<td><textarea id=”description0″ cols=”30″ name=”description0″ rows=”2″></textarea></td>
<td><input id=”unitprice0″ class=”unitpricewidth” name=”unitprice0″ type=”text” onChange=”updateitem0()”/></td>
<td><input id=”itemsum0″ class=”totalpricewidth” name=”itemsum0″ readonly=”readonly” type=”text” /></td>
</tr>
<tr>
<td><input id=”quantity1″ class=”quantitywidth” name=”quantity1″ type=”text” onChange=”updateitem1()” /></td>
<td><input id=”item1″ class=”itemwidth” name=”item1″ type=”text” /></td>
<td><textarea id=”description1″ cols=”30″ name=”description1″ rows=”2″></textarea></td>
<td><input id=”unitprice1″ class=”unitpricewidth” name=”unitprice1″ type=”text” onChange=”updateitem1()”/></td>
<td><input id=”itemsum1″ class=”totalpricewidth” name=”itemsum1″ readonly=”readonly” type=”text” /></td>
</tr>
<tr>
<td><input id=”quantity2″ class=”quantitywidth” name=”quantity2″ type=”text” /></td>
<td><input id=”item2″ class=”itemwidth” name=”item2″ type=”text” /></td>
<td><textarea id=”description2″ cols=”30″ name=”description2″ rows=”2″></textarea></td>
<td><input id=”unitprice2″ class=”unitpricewidth” name=”unitprice2″ type=”text” /></td>
<td><input id=”totalprice2″ class=”totalpricewidth” name=”totalprice2″ type=”text” /></td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td></td>
<td><input id=”subtotal” class=”totalpricewidth” name=”subtotal” type=”text” readonly=”readonly” /></td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td></td>
<td><input id=”shipping” class=”totalpricewidth” name=”shipping” type=”text” /></td>
</tr>
</tbody>
</table>
</fieldset><br /><fieldset><legend>Section 3</legend>
<p><label class=”field” for=”signature”>Staff Member Signature: </label> <input id=”fax” class=”textbox” name=”fax” type=”text” /></p>
</fieldset><br /><br />
<p><input type=”submit” value=”Generate PDF” /></p>
</form>