XHTML » XHTML Core Tag » onsubmit

Syntax:
onsubmit="action"

The onsubmit event occurs when the user submits a form. There are many possible courses of action when using an onsubmit event. For example, before proceding on to the next page, you could call a function to check the various entries on the form for correctness.

These six events are useful when dealing with forms and form elements:
 

  • onblur - runs a script when the element loses focus.
  • onchange - runs a script when the element changes.
  • onfocus - runs a script when the element gets the focus.
  • onreset - runs a script when the form is reset.
  • onselect - runs a script when the element is selected.
  • onsubmit- runs a script when the form is submitted.
  • Examples

    Code:
    <?xml version="1.0" encoding="UTF-8"?>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
    <head>
    <title>DevGuru Test Form</title>
    <script type="text/javascript">
    function checksubmit()
    {
       if (document.formname.fullname.value == "")
       {
          alert("Please enter your full name")
          document.formname.fullname.focus()
          return false
       }
       if (document.formname.emailaddress.value == "")
       {
          alert("Please enter your email address")
          document.formname.emailaddress.focus()
          return false
       }
       return true
    }
    </script>
    </head>
    <body onload="document.formname.fullname.focus()">
    <b>
    FORM EXAMPLE
    <br /><br />
    Please leave one or both of the required fields blank and click the submit button.
    </b>
    <br />
    <hr />
    <br />
    If you wish to receive information about upgrades to dgCharge,<br />
    please fill out this form.
    <br /><br />
    <form method="post" name="formname" action="html_form_example.asp"onsubmit="return checksubmit()">
    Full Name (required)       
    <input type="text" name="fullname" size="30" />
    <br /><br />
    Email Address (required)
    <input type="text" name="emailaddress" size="30" />
    <br /><br />
    Phone Number (optional)
    <input type="text" name="phonenumber" size="15" />
    <br /><br />
    <input type="submit" name="submitbtn" value="Submit" />
    <input type="reset" value="Clear" />
    </form>
    </body>
    </html>
    Output:
    FORM EXAMPLE

    Please leave one or both of the required fields blank and click the submit button.



    If you wish to receive information about upgrades to dgCharge,
    please fill out this form.

    Full Name (required)

    Email Address (required)

    Phone Number (optional)

    Explanation:

    In this form example, the onsubmit event is used in the form tag to call the JavaScript checksubmit function.

    Language(s): XHTML

    See Also: