Web Analytics Made Easy - StatCounter Adding numbers that have been entered in a form - CodingForum

Announcement

Collapse
No announcement yet.

Adding numbers that have been entered in a form

Collapse
X
Collapse
 
  • Page of 1
  • Filter
  • Time
  • Show
Clear All
new posts
Previous template Next
  • #1

    Adding numbers that have been entered in a form

    I have the following code that I wrote myself (except for the function isNumberKey). However, I don't know how to actually add the numbers together. My plan is to store the value entered in the forms as a variable, then manipulate the variables to get my final number. The final number would be stored in variable named Total and would be displayed after Total: at the bottom of my page.

    Could anyone help me? I can provide additional information if you need it.

    Code:
       
<HTML>
<TITLE>Magazine Prices </TITLE>
   <BODY>
   <SCRIPT language=Javascript>
      <!--

	   Price = oForm.elements["price"].value;
	Quantity = oForm.elements["quantity"].value;
	Subtotal = oForm.elements["subtotal"].value;
	Shipping = oForm.elements["shipping"].value;


      function isNumberKey(evt)
      {
         var charCode = (evt.which) ? evt.which : event.keyCode
         if (charCode > 31 && (charCode < 48 || charCode > 57))
            return false;

         return true;
}
      //-->
   </SCRIPT>

<!-- Price * Quantity = Subtotal. Subtotal value should fill in automatically in the Subtotal input field.  Subtotal * Shipping = Total. //-->


<TABLE>

<TR><TD>Price: </TD><TD><INPUT id="Price" name="Price" onkeypress="return isNumberKey(event)" type="text" name="txtChar"> </TD></TR>

<TR><TD>Quantity:</TD> <TD><INPUT id="Quantity" name="Quantity" onkeypress="return isNumberKey(event)" type="text" name="txtChar"> </TD></TR>

<TR><TD>Subtotal:</TD> <TD><INPUT id="Subtotal" name="Subtotal" onkeypress="return isNumberKey(event)" type="text" readonly="readonly" name="txtChar"> </TD></TR>

<TR><TD>Shipping:</TD> <TD><INPUT id="Shipping" name="Shipping" onkeypress="return isNumberKey(event)" type="text" value="10%" readonly="readonly" name="txtChar"> </TD></TR>

</TABLE>

<b>Total:   </b>

   </BODY>
</HTML>
    Tags: None
  • #2
    (1) language="javascript" is obsolete. Use type="text/javascript".
    (2) You don't need to "hide" javascript from browsers that don't support it. For one thing, your page won't work if the browser doesn't support javascript. But more importantly, the need to do that vanished with MSIE 3 in about 1998.

    Aside from that...

    Code:
    <HTML>
<TITLE>Magazine Prices </TITLE>
<head>
<script type="text/javascript">
function calculate(field)
{
    var oForm = field.form;
    var Price = Number(oForm.price.value);
    if ( isNaN(Price) )
    {
        alert("Price is not a valid number");
        Price = 0;
        oForm.price.value = "0";
    }
    var Quantity = Number(oForm.quantity.value);
    if ( isNaN(Quantity) )
    {
        alert("Quantity is not a valid number");
        Quantity = 0;
        oForm.quantity.value = "0";
    }
    var Subtotal = Price * Quantity;
    oForm.subtotal.value = Subtotal.toFixed(2);

    var Shipping = 0.10;
    var Total = Subtotal + Shipping * Subtotal
    oForm.total.value = Total.toFixed(2);
}
</script>
</head>
<body>
<form> <!-- will never work without this! -->
<TABLE>
    <TR><TD>Price: </TD><TD><INPUT name="price" onchange="calculate(this);"></TD></TR>
    <TR><TD>Quantity:</TD><TD><INPUT name="quantity" onchange="calculate(this);"> </TD></TR>
    <TR><TD>Subtotal:</TD><TD><INPUT name="subtotal" readonly></TD></TR>
    <TR><TD>Shipping:</TD><TD><INPUT name="shipping" value="10%" readonly></TD></TR>
    <TR><TD>Total:</TD><TD><INPUT name="total" readonly></TD></TR>
</TABLE>
</form> <!-- will never work without this! -->
</BODY>
</HTML>
    Last edited by Old Pedant; Aug 25, 2011, 04:18 PM.
    Be yourself. No one else is as qualified.

    Comment

    Previous template Next
    Working...
    X