We help IT Professionals succeed at work.

Simple Javascript Validation & "Sum" help

xcusmwah
xcusmwah asked
on
Medium Priority
534 Views
Last Modified: 2012-08-13
Just starting out with javascript.  I figured out how to get the fields to sum but wanted to see how someone else would do it.  I would also like to see how to validate the form so that the dollar sign and decimal point gets added in to the currency fields but still "add" the result to the total field with the dollar sign.  It would be great to have it so only numeric data can be entered in.  Thank you...below is what I have...feel free to tweak anything you wish but if you could leave the field names the same I would appreciate it.

<html>
<head>

<script language="JavaScript">
function addForm(){
document.form.req_TotalRaisedforWeek.value = document.form.req_TotalFundsRaisedatRegisters.value * 1 + document.form.req_WeekendEventTotalAmountRaised.value *1;

</script>

</head>
<body>
<form enctype="multipart/form-data" name="form">
    <center>
    <table WIDTH="600" BORDER=0 align="left" >

      <tr>

        <td HEIGHT="29" colspan="2">
          <h1>Javascript Test Form</h1></td>
      </tr>
      <tr>
        <td width="55%" height="28" bgcolor="#FFFFCC"><font color="#000000"><b>Person Submitting: <font color="#FF0000">*</font></b> </font></td>
        <td width="45%">
          <div align="left">
            <input name="req_PersonSubmitting" id="req_PersonSubmitting">
          </div></td>
      </tr>
      <tr>
        <td height="28" nowrap bgcolor="#FFFFCC"><strong>Total Funds Raised at
            Registers (Canisters):<font color="#000000"><font color="#FF0000">*</font></font></strong></td>
        <td>
          <div align="left">
            <input name="req_TotalFundsRaisedatRegisters" id="req_TotalFundsRaisedatRegisters" onChange="addForm();" size="6" maxlength="6">
          </div></td>
      </tr>
      <tr>
        <td height="28" bgcolor="#FFFFCC"><strong> Weekend
            Event Description: <font size="2">(if none, type none)</font><font color="#000000"><font color="#FF0000">*</font></font></strong></td>
        <td>
          <div align="left">
            <input name="req_WeekendEventDescription" id="req_WeekendEventDescription" onChange="addForm();" size="20" maxlength="6">
          </div></td>
      </tr>
      <tr>
        <td bgcolor="#FFFFCC"><strong>Weekend Event Total Amount Raised:<font color="#000000"><font color="#FF0000">*</font></font></strong></td>
        <td bgcolor="#FFFFFF">
          <div align="left">
            <input name="req_WeekendEventTotalAmountRaised" id="req_WeekendEventTotalAmountRaised" onChange="addForm();" size="6" maxlength="6">
          </div></td>
      </tr>
      <tr bgcolor="#FFFFFF">
        <td height="3" colspan="2"><br></td>
      </tr>
      <tr>
        <td height="28" nowrap bgcolor="#FFFFCC"><strong><font color="#000000">Total Raised for Week: <font size="2">(automatically
          calculated)</font><font color="#FF0000">*</font></font></strong></td>
        <td>
          <div align="left">
            <input name="req_TotalRaisedforWeek" id="req_TotalRaisedforWeek" size="7" maxlength="7" onFocus="blur()">
          </div></td>
      </tr>
      <tr>
        <td height="28" colspan="2">&nbsp;</td>
      </tr>
      <tr>
        <td height="28" colspan="2"><input type="submit" value="Submit" onClick="addForm();" ></td>
      </tr>
    </table>

    <br>
    </center>

</form>
</body>
</html>
Comment
Watch Question

Commented:
Unlock this solution and get a sample of our free trial.
(No credit card required)
UNLOCK SOLUTION
Unlock the solution to this question.
Thanks for using Experts Exchange.

Please provide your email to receive a sample view!

*This site is protected by reCAPTCHA and the Google Privacy Policy and Terms of Service apply.

OR

Please enter a first name

Please enter a last name

8+ characters (letters, numbers, and a symbol)

By clicking, you agree to the Terms of Use and Privacy Policy.