วิธีส่งฟอร์ม HTML ด้วย JavaScript

เพื่อส่งฟอร์ม HTML ด้วย JavaScript เราเรียก validate() เพื่อตรวจสอบข้อมูลเมื่อเหตุการณ์ onsubmit เกิดขึ้น

ตัวอย่าง

ลองรันโค้ดด้านล่างเพื่อส่งฟอร์ม HTML

<html>
  <head>
    <title>Form Validation</title>
    <script>
      // Form validation
      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>