View Full Version : Adding numbers that have been entered in a form

08-25-2011, 07:45 PM
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.

<TITLE>Magazine Prices </TITLE>
<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;

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


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


<b>Total: </b>


Old Pedant
08-25-2011, 08:14 PM
(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...

<TITLE>Magazine Prices </TITLE>
<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);
<form> <!-- will never work without this! -->
<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>
</form> <!-- will never work without this! -->