Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    New to the CF scene
    Join Date
    Aug 2011
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Question 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>

  • #2
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    25,020
    Thanks
    75
    Thanked 4,323 Times in 4,289 Posts
    (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; 08-25-2011 at 08:18 PM.
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •