Home/ Questions/Q 4015556
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-20T09:38:00+00:00

I am currently working on JavaScript. This is what I have so far.. <script

  • 0

I am currently working on JavaScript. This is what I have so far..

     <script type="text/javascript">

     function formCheck(){
      var emailFilter=/^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-   Z0-9]{2,4})+$/;
    if (document.form.frmName.value==''){
    alert('Please enter your name');
    document.form.frmName.focus();
    document.getElementById("reqName").style.fontWeight="bold";
    return false;  
  }
      if (!(emailFilter.test(document.form.frmEmail.value))){
    alert('Please enter your email address correctly');
    document.form.frmEmail.focus();
    document.getElementById("reqEmail").style.fontWeight="bold";
    return false;
    }
    return true;
    } 
     function submitForm() [
     if (document.forms[0].firstName.value==""
     || document.forms[0].lastName.value=="") {
     window.alert("You must enter your first and last names!");
     return false;
      }
       else
     return true;
      }
   </script>
   </head>
   <body>
   <h2>**RSVP to my Party**</h2>
    <form action="myform" method="post" name="form" onsubmit="return formCheck()">
   <table>
  <tr>
      <td><span id="reqName"> First Name:</span></td>
      <td><input type="text" name="frmName"></td>
  </tr>
  <td><span id="reqName"> Last Name:</span></td>
      <td><input type="text" name="frmName"></td>
  </tr>
  <td><span id="reqName"> Number of Guest:</span></td>
      <td><input type="text" name="NumberofGuest"></td>
  </tr>
  <td><span id="reqName"> Time Arriving:</span></td>
      <td><input type="text" name="TimeArriving"></td>
   </tr>
  <tr>
     <td><span id="reqEmail"> Email:</span></td>
     <td><input type="text" name="frmEmail">
<input type="submit" value="Send" class="submit" /></td>
  </tr>
<tr>
  <td><span id=Submit"><input type="Submit" value="Submit" /></td>
  <td><span id="reset"><input type="reset" value="Start Over" /></td>
</tr>

  </table>
  </form>

  </body>
  </html>

I am getting a little confused I need to get it where each code to verify that the users have enter the data into all the fields. Now do I take each field and make them each have a submit button for them to read that? I know the email one works right.

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    in your form html, call the submitForm() function:

    <form action="myform" method="post" name="form" onsubmit="return submitForm();">

    Then in your submitForm() function, call all the testing functions:

    function submitForm()
{
    if (document.forms[0].firstName.value==""
        || document.forms[0].lastName.value=="") 
    {
        window.alert("You must enter your first and last names!");
        return false;
    }
    else
        // this is short for 'if nameCheck() == true && whateverCheck == true && ...'
        return formCheck() && nameCheck() && whateverCheck();
  }

    Remark: If the user made several mistakes, you must modify the checking call to directly find all mistakes like this:

        //...
    else
    {
        var allOk = true;
        allOk = formCheck() ? allOk : false;
        allOk = nameCheck() ? allOk : false;
        allOk = whateverCheck() ? allOk : false;

        return allOk;
    }

    Inside of each testing function, you can modify the field that’s being tested to show errors in the user’s input, e.g. by changing the inputLabel.style.color='red'.

    Edit:

    You should create a single, simple function for each field type you want to test.
    Typical field types for input type="text" are:

    • numeric field (e.g. age)
    • general text field (e.g. name, street, profession, …)
    • specific data fields (examples:)
      • zip code
      • date
      • time
      • ip address
      • email

    This way you will probably be able to use the same function for first and last name instead of creating two separate functions. That also means you can take them with you to your next project instead of needing to program everything again…

    These testing functions will take an object (i.e. an input field) and return a boolean:

    function testMyNameTextField(var testfield)
{
    // check if testfield isn't null and is valid

    var nameTextFilter = /someregexp/;
    var everythingIsOk = (testfield.value != '') && (nameTextFilter.test(testfield.value));
    testfield.style.borderColor = everythingIsOk ? '' : 'red';
    return everythingIsOk;
}

    You can of course separate the testing and the invalid field markup into two different functions.

    Finally, for each text input field you want to test, call the appropriate testing function.

    • 0