submit() event: Define any action when a form is submitted in Jquery

Date Published: 11/05/2020Published By: JaiSchool

The submit() is a form event in Jquery. It is used to perform any action before submitting a form when clicked on the submit button. You also use it to automatically trigger a form submit action.

submit() event

<!DOCTYPE html>
<html>
<head>
  <title>Jquery submit() event</title>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
</head>
<body>

<form>
  <label>Username</label>
  <input type="text" name="username">
  <label>Password</label>
  <input type="password" name="password">
  <input type="submit" value="Log in">

</form>

<script>
  $(document).ready(function(){
    $("form").submit(function(){
      alert("form will be submitted.");
    });
  });
</script>
</body>
</html>

Trigger form submit event automatically

When you click on button then submit event automatically triggers.

<!DOCTYPE html>
<html>
<head>
  <title>Jquery submit() event</title>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
</head>
<body>

<form id="form">
  <label>Username</label>
  <input type="text" name="username">
  <label>Password</label>
  <input type="password" name="Password">
</form>

<button>Submit</button>

<script>
  $(document).ready(function(){
    $("button").click(function(){
      $("#form").submit();
    })
  });
</script>
</body>
</html>

Publish A Comment

Leave a Reply

Your email address will not be published.