Link to home
Start Free TrialLog in
Avatar of GCOOK1
GCOOK1

asked on

Need javascript help calculating subtotals on a form

I need some help with javascript.  My script is below.  I have the extended cost fields working properly.  How do I write the javascript to automatically calculate and display the subtotal?

<html>
     <head>
     <SCRIPT language="Javascript">
       function handleEnter (field, event) {
            var keyCode = event.keyCode ? event.keyCode : event.which ? event.which : event.charCode;
            if (keyCode == 13) {
                  var i;
                  for (i = 0; i < field.form.elements.length; i++)
                        if (field == field.form.elements[i])
                              break;
                  i = (i + 1) % field.form.elements.length;
                  field.form.elements[i].focus();
                  return false;
            }
            else
            return true;
            }


     function calculate(index){
          var formObject = document.forms[0];
          var quantity = formObject.elements['r'+index+'c1'].value;
          var price = formObject.elements['r'+index+'c2'].value;
          if(quantity > 0 && price > 0){
               formObject.elements['r'+index+'c3'].value = quantity * price;
          }
     }

     </script>
</head>
<body>
<form name="MyForm">
<table cellpadding="0" border="0" ID="Table1">
     <tr>
          <td>ITEM</td>
          <td>QUANTITY</td>
          <td>COST</td>
          <td>EXTENDED COST</td>
     </TR>
     <TR>
          <td><p>Line 1</td>
          <td><input type="text" size="5" id="r1c1" name="r1c1" onchange="calculate(1)" onkeypress="return handleEnter(this, event)"></td>
          <td><input type="text" size="5" id="r1c2" name="r1c2" onchange="calculate(1)" onkeypress="return handleEnter(this, event)"></td>
          <td><input type="text" size="5" id="r1c3" name="r1c3" onkeypress="return handleEnter(this, event)"></td>
     </TR>
     <TR>
          <td><p>Line 2</td>
          <td><input type="text" size="5" id="r2c1" name="r2c1" onchange="calculate(2)" onkeypress="return handleEnter(this, event)"></td>
          <td><input type="text" size="5" id="r2c2" name="r2c2" onchange="calculate(2)" onkeypress="return handleEnter(this, event)"></td>
          <td><input type="text" size="5" id="r2c3" name="r2c3" onkeypress="return handleEnter(this, event)"></td>
     </TR>
     <tr>
      <td>Subtotal</td>
      <td></td>
      <td></td>
                     <td><input type="text" size="5" id=subtot name=subtot></td>
     </tr>
   </table>
</form>
</body>
</html>
ASKER CERTIFIED SOLUTION
Avatar of UnTwstr
UnTwstr

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial