Property 'submit' of object # is not a function

Question

Can anyone explain to me what this error means? I would appreciate it a lot for any kindof help with this.

<form class="form" id="form" action="/mailer.php" method="post">

The Jquery code I'm using for it is this.

$('#form').submit();

Try using `$('#form')[0].submit();` OR simply `document.getElementById('form').submit();` .. BTW, your current code should actually work.. — techfoobar, Sep 22 '12 at 05:24
It seems that there is a conflict on your page, prototype/mootools/...? — Ram, Sep 22 '12 at 05:25
I'll try the first option in just one moment. Second reply... jquery.min.js — Andrew Allen West, Sep 22 '12 at 05:27
@techfoobar he's selecting by `ID`.. It would only get the first matched element anyways — wirey00, Sep 22 '12 at 05:34
And $('#form')[0].submit(); OR simply document.getElementById('form').submit(); are not working. I'm going to upload the code to a text file and update my original post so everyone can take a look. — Andrew Allen West, Sep 22 '12 at 05:40

xdazz · Accepted Answer · 2012-09-22T05:43:26.637

141

Check the form to see whether there is a HTMLInputElement with id or name is submit.

This will set a property submit to the HTMLFormElement, so the submit function which is in the prototype of the form element can't be executed.

Example:

<form class="form" id="form" action="/mailer.php" method="post">
    <input type="button" name="submit" value="go"/>
</form>

js:

console.log($("#form")[0].submit);  // will be the button element, not the submit function.

jQuery's .submit() method will call the .submit() on the original dom element, so the error will happen.

edited Sep 22 '12 at 05:43

answered Sep 22 '12 at 05:37

xdazz

158,678
38
247
274

3

There is a 'mock' submit input type="button" name="submit" so .. i'll remove the name and see if that works. – Andrew Allen West Sep 22 '12 at 05:42
@AndrewAllenWest Yes, that must be the reason. – xdazz Sep 22 '12 at 05:42
Bear in mind that jquery < 1.9 have a bug regarding the naming of submit button, ie: you cannot name submit button "submit" :) - http://jsfiddle.net/JscKb/ – eithed Mar 15 '13 at 10:57
2

That's not a bug. That's just how the underlying DOM works. There is a work around, but it doesn't work in versions of Internet Explorer that are officially supported by jQuery 1.9 and lower. – Quentin May 05 '13 at 12:57
2

Just had a damn hard time find the solution for the same problem thank you very much! – David Fariña Aug 22 '13 at 11:54
2

Great catch that should save people from banging their heads against the table. – chaseadamsio Nov 06 '13 at 00:43

ainokna · Answer 2 · 2013-12-28T15:59:14.293

28

xdazz explained the issue well.

You can use a native submit method of HTMLFormElement to work around a problem:

HTMLFormElement.prototype.submit.call($('#form')[0]);

edited Dec 28 '13 at 15:59

answered Apr 05 '13 at 11:32

ainokna

855
10
18

4

Thanks heaps! This worked for me! Ironically this answer has no up votes. – JohnnyQ Jun 19 '13 at 14:32
1

Thanks for the workaround! This is great to execute forms in the console if they have this issue... Which was the case on an IT comments form... – Tym Pollack Aug 09 '13 at 17:45
This is a good alternative if xdazz's solution is not enough! – Manatax Oct 07 '13 at 20:50

score 7 · Answer 3 · edited Feb 26 '14 at 16:54

7

If you have a button or input with the name submit or id submit, I have seen errors in IE. Make sure your inputs are correctly named. Here's an article on it http://bugs.jquery.com/ticket/1414

edited Feb 26 '14 at 16:54

Ry-

218,210
55
464
476

answered Sep 22 '12 at 05:48

Alex Reynolds

6,264
4
26
42

Property 'submit' of object # is not a function

3 Answers3

Linked

Related