How to solve “Submit is not a function” error in JavaScript ?

Ever tried to submit a form, by using a JavaScript? But when you tried to submit the form by using JavaScript, you might be getting a “Submit is not a function” error in the code. Well, don’t panic as of yet. This article is being dedicated to solving that problem of yours.

So what are we waiting for? Let’s dig in.

Example: You will get “Submit is not a function” error in this.



filter_none

edit
close

play_arrow

link
brightness_4
code

<!DOCTYPE html>
<html>
  
<head>
    <title>“Submit is not a function” 
      error in JavaScript</title>
</head>
  
<body>
  
    <body style="text-align:center;">
        <h2 style="color:green">GeeksForGeeks</h2>
        <h2 style="color:purple">
          “Submit is not a function” error
      </h2>
        <form action="product.php"
              method="get" 
              name="frmProduct" 
              id="frmProduct" 
              enctype="multipart/form-data">
            
            <input onclick="submitAction()"
                   id="submit_value"
                   type="button" 
                   name="submit_value"
                   value="CLICK HERE">
        </form>
        <script type="text/javascript">
            function submitAction() {
                document.frmProduct.submit();
            }
        </script>
    </body>
    <html>

chevron_right


The Error:
(The article continues after the image)
ngcut

There are 5 different types of solution to this problem.

Solution 1:
Simply rename your button’s name to btnSubmit or any other name. Your code will miraculously work. This is because you have already named the submit button or any other element in the code as submit. When the button is named as submit, it is going to override the submit() function on this code.

btnSubmit

Example:

filter_none

edit
close

play_arrow

link
brightness_4
code

<!DOCTYPE html>
<html>
  
<head>
    <title>
      “Submit is not a function” error in JavaScript
  </title>
</head>
  
<body style="text-align:center;">
    <h2 style="color:green">GeeksForGeeks</h2>
    <h2 style="color:purple">
      “Submit is not a function” error
  </h2>
    <form action="product.php" 
          method="get"
          name="frmProduct" 
          id="frmProduct" 
          enctype="multipart/form-data">
        
        <input onclick="submitAction()" 
               id="submit_value" 
               type="button"
               name="submit_value" 
               value="CLICK HERE">
    </form>
    <script type="text/javascript">
        function submitAction() {
            document.frmProduct.btnSubmit();
        }
    </script>
</body>
<html>

chevron_right


Solution 2:
Simply let the button handle and decide which object of the form to be used.

onclick="return SubmitForm(this.form)"

Example:

filter_none

edit
close

play_arrow

link
brightness_4
code

<!DOCTYPE html>
<html>
  
<head>
    <title>
      “Submit is not a function”
      error in JavaScript
  </title>
</head>
  
<body>
  
    <body style="text-align:center;">
        <h2 style="color:green">
          GeeksForGeeks
      </h2>
        <h2 style="color:purple">
          “Submit is not a function” error
      </h2>
        <form action="product.php"
              method="get" 
              name="frmProduct"
              id="frmProduct" 
              enctype="multipart/form-data">
  
            <input onclick="return SubmitForm(this.form)"
                   id="submit_value"
                   type="button" 
                   name="submit_value"
                   value="CLICK HERE">
        </form>
        <script type="text/javascript">
            function submitAction() {
                document.frmProduct.submit();
            }
        </script>
    </body>
    <html>

chevron_right


Solution 3:
If there is no name=”submit” or id=”submit” in the form, make sure to remove or edit it. Also by making sure that there will no other form that is having the same name. This will give an error.

Solution 4:
If there are no changes in the output (still getting an error) by implementing the Solution 3 i.e. having a chance to change name=”submit” or id=”submit”, you could also prevent the error by making changes in the JavaScript.

Example:

filter_none

edit
close

play_arrow

link
brightness_4
code

<!DOCTYPE html>
<html>
  
<head>
    <title>
      “Submit is not a 
      function” error in JavaScript
  </title>
</head>
  
<body style="text-align:center;">
    <h2 style="color:green">
      GeeksForGeeks
  </h2>
    <h2 style="color:purple">
      “Submit is not a function” error
  </h2>
    <form action="product.php" 
          method="get" 
          name="frmProduct"
          id="frmProduct"
          enctype="multipart/form-data">
        
        <input onclick="submitAction()"
               id="submit_value" 
               type="button" 
               name="submit_value"
               value="CLICK HERE">
    </form>
    <script type="text/javascript">
        function submitForm(form) {
            var submitFormFunction = 
                Object.getPrototypeOf(form).submit;
            submitFormFunction.call(form);
        }
    </script>
</body>
<html>

chevron_right


Solution 5:
By making some changes in the JavaScript.

Example:

filter_none

edit
close

play_arrow

link
brightness_4
code

<!DOCTYPE html>
<html>
  
<head>
    <title>
      “Submit is not a function”
      error in JavaScript
  </title>
</head>
  
<body style="text-align:center;">
    <h2 style="color:green">
      GeeksForGeeks
  </h2>
    <h2 style="color:purple">
      “Submit is not a function” error
  </h2>
    <form action="product.php"
          method="get" 
          name="frmProduct" 
          id="frmProduct" 
          enctype="multipart/form-data">
        
        <input onclick="submitAction()" 
               id="submit_value" 
               type="button" 
               name="submit_value" 
               value="CLICK HERE">
    </form>
    <script type="text/javascript">
        function submitForm(form) {
            var enviar = 
                document.getElementById("enviar");
            enviar.type = "submit";
        }
    </script>
</body>
<html>

chevron_right


Output:
When we lead the code
ngcut

The error message
ngcut

After using the solutions:
“Submit is not a function” error
ngcut



My Personal Notes arrow_drop_up

Check out this Author's contributed articles.

If you like GeeksforGeeks and would like to contribute, you can also write an article using contribute.geeksforgeeks.org or mail your article to contribute@geeksforgeeks.org. See your article appearing on the GeeksforGeeks main page and help other Geeks.

Please Improve this article if you find anything incorrect by clicking on the "Improve Article" button below.