JavaScript submit form onclick method using id, class, and name

  • by

JavaScript submits form perform through submit using submit button, by clicking on the hyperlink, button and image tag, etc with onclick method.

You can use any attributes like id, name, class, tag name as well to submit form onclick method. JavaScript submit() function to create an object, which keeps form attribute to perform submit action.

onclick form submit by id

document.getElementById("form_id").submit();

onclick form submit by class

var x = document.getElementsByClassName("form_class");
x[0].submit();

onclick form submit by name

var x = document.getElementsByName('form_name');
x[0].submit();

onclick form submit by tag name

var x = document.getElementsByTagName("form");
x[0].submit();

JavaScript submit form onclick example

Simple example code.

<html>
<head>
  <title>Javascript Form Submit Example</title>
  <script>

   function submit_by_id() {
    alert("Submit by ID")
  }


  function submit_by_name() {
    alert("Submit by Name")
  }


  function submit_by_class() {
    alert("Submit by Class")
  }


  function submit_by_tag() {
    alert("Submit by Tag")
  }


</script>
</head>
<body>
  <div class="container">
    <form action="#" method="post" name="form_name" id="form_id" class="form_class" >

      <h2>Javascript Form Submit Example</h2>

      <label>Name :</label>
      <input type="text" name="name" id="name" placeholder="Name" />

      <label>Email :</label>
      <input type="text" name="email" id="email" placeholder="Valid Email" /><br><br>

      <input type="button" name="submit_id" id="btn_id" value="Submit by Id" onclick="submit_by_id()"/>

      <input type="button" name="submit_name" id="btn_name" value="Submit by Name" onclick="submit_by_name()"/>

      <input type="button" name="submit_class" id="btn_class" value="Submit by Class" onclick="submit_by_class()"/>

      <input type="button" name="submit_tag" id="btn_tag" value="Submit by Tag" onclick="submit_by_tag()"/>
    </form>
  </div>
</body>
</html>

Output:

JavaScript submit form onclick

Do comment if you have any doubts or suggestions on this Python JS onClick topic.

Note: The All JS Examples codes are tested on the Firefox browser and the Chrome browser.

OS: Windows 10

Code: HTML 5 Version

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.