Solution: Property ‘submit’ of object #<HTMLFormElement> is not a function

By Avinash

May 16, 2012Tutorial4 Comments

If you have came accross this problem then you are at right place for the solution. I have the same problem and I was not sure what the real problem is. I was just about to bang my head on WALL :).

But hopefully I have found the solution for the same. But first let me explain what the scenario is:

Problem Definition

I had one simple HTML form and have done JS validation and coded to submit the form using document.getElementById('form_id').submit(); method.

But whenever I call this submit method I was getting below error:

Uncaught TypeError: Property ‘submit’ of object #<HTMLFormElement> is not a function

I was not sure about the what the problem is becuase I was not doing any extra ordanary thing. The code is just about to submit the form using the javascript that’s it. Do you think is there anything special yet?

Solution

As you can see the problem is tricky so solution is also quite tricky. The real problem is with the name and/or id of your submit button. Surprised????

Yes the problem was the name attribute of the submit button in form which I was trying to submit.

Reason

Let’s say if your form element has a button with ID/name “submit”. When you trigger form.submit(), browser actually tries to run button element as a function instead of running the form’s submit function.

Demo

If you are not trusting me about the possibility of this problem then create one HTML file and place below html form code in that file, here you can notice the name of the submit button is “submit”. This problem may occur when you have is set to submit.

<form method="post">
  <fieldset>
    <input type="text" name="demo_name">
    <input type="submit" name="submit" value="Submit">
    <input type="button" name="cancel" value="Cancel">
  </fieldset>
</form>

Now try to submit this form using JavaScript and have a look at your console for the error and see the magic ;) Like us on Facebook or Follow us on Twitter if you like this article.

Share This Article

  • kkatusic

    I had this problems, now I know why :)

  • anon

    So what’s the solution? How do you submit the form if you don’t have control over the HTML in order to change the name of the submit button?

  • Germán

    A whole hour to find the solution! Thank you very much! :)

  • Klaitos

    Awesome fix, saved a lot of time.
    Thank buddy !