জাভাস্ক্রিপ্ট ব্যবহার করে HTML ফর্ম সাবমিট করার উপায়

জাভাস্ক্রিপ্ট ব্যবহার করে HTML ফর্ম সাবমিট করতে onsubmit ইভেন্টের সময় validate() কল করে ডেটা ভ্যালিডেট করা হয়।

উদাহরণ

নিচের কোড চালিয়ে HTML ফর্ম সাবমিট করুন:

<html>
  <head>
    <title>Form Validation</title>
    <script>
      function validate() {
        if( document.myForm.Name.value == "" ) {
          alert( "Please provide your name!" );
          document.myForm.Name.focus();
          return false;
        }
        if( document.myForm.EMail.value == "" ) {
          alert( "Please provide your Email!" );
          document.myForm.EMail.focus();
          return false;
        }
        if( document.myForm.Zip.value == "" || isNaN( document.myForm.Zip.value ) || document.myForm.Zip.value.length != 5 ) {
          alert( "Please provide a zip in the format #####." );
          document.myForm.Zip.focus();
          return false;
        }
        if( document.myForm.Country.value == "-1" ) {
          alert( "Please provide your country!" );
          return false;
        }
        return( true );
      }
    </script>
  </head>
  <body>
    <form action="/cgi-bin/test.cgi" name="myForm" onsubmit="return(validate());">
      <table cellspacing="2" cellpadding="2" border="1">
        <tr>
          <td align="right">Name</td>
          <td><input type="text" name="Name" /></td>
        </tr>
        <tr>
          <td align="right">EMail</td>
          <td><input type="text" name="EMail" /></td>
        </tr>
        <tr>
          <td align="right">Zip Code</td>
          <td><input type="text" name="Zip" /></td>
        </tr>
        <tr>
          <td align="right">Country</td>
          <td>
            <select name="Country">
              <option value="-1" selected>[choose yours]</option>
              <option value="1">Canada</option>
              <option value="2">Sri Lanka</option>
              <option value="3">Mexico</option>
            </select>
          </td>
        </tr>
        <tr>
          <td align="right"></td>
          <td><input type="submit" value="Submit" /></td>
        </tr>
      </table>
    </form>
  </body>
</html>