Cannot programmatically submit form

Question

Cannot get my form to submit programmatically, despite trying several ways. Tried pure JS, also tried jQuery. No success.

I have this form tag :

<form action="https://docs.google.com/forms/d/13zex8ZsEsnZz3A8uB4jU4oDb5wZfaqqq2Pq2CGlIe6M/formResponse" method="POST" id="ss-form" target="_self" onsubmit="" name="eForm">
    <!--My Form Stuff-->
    <input type="submit" name="submit" value="Submit" id="ss-submit">
</form>

Here is what i've tried :

/*jQuery*/
$('#ss-form').submit();

/*Javascript*/
document.getElementById('ss-form').submit();
document.eForm.submit();

None of them work. Not sure why, but I am assuming it has something to do with me trying to submit a google form. If I physically click the submit everything works fine.

Any and all help is greatly apprecaiated.

Maybe you have more JS which causes a problem? Do you see any errors ? — putvande, Jun 23 '14 at 16:03
@putvande no console errors. Everything else is working fine. — Adjit, Jun 23 '14 at 16:03
@Adjit out of curiosity, can you use one of those lines you proposed in the console? — esqew, Jun 23 '14 at 16:04
@DaveNewton nothing. Doesn't give me an error, or anything. Its as if the function isn't there. — Adjit, Jun 23 '14 at 16:06
@IonicãBizãu yes, the form is loaded. Currently using jQuery `$(document).ready()` also tried `(function(){})()` — Adjit, Jun 23 '14 at 16:07
Where is the submission code? Is it in an event handler? If you check the Network tab of DevTools, do you see any mention of submitting the form? I also wonder about `onsubmit=""` -- does removing that change anything? — Barmar, Jun 23 '14 at 16:10
@IonicãBizãu what are you using to submit? when I try to even submit through the console it gives my a type error saying an object is not a function — Adjit, Jun 23 '14 at 16:15
What are you trying to do? Just put this script out of the head, at the end of body... — Flash Thunder, Jun 23 '14 at 16:15
@FlashThunder thats not the issue. I am trying to submit the form as soon as the page loads — Adjit, Jun 23 '14 at 16:17
@Barmar don't see any mention of form submission. Also, took out `onsubmit`... no dice. — Adjit, Jun 23 '14 at 16:18
@esqew I get type errors saying an object is not a function when I try to submit with the console — Adjit, Jun 23 '14 at 16:19
This is because your `submit input` name is `submit` ... and it is restricted name that overrides `form.submit()` function... just rename it to something else like `submiter` and it will work. — Flash Thunder, Jun 23 '14 at 16:33

score 10 · Accepted Answer · answered Jun 23 '14 at 16:23

10

The problem is that you have a field (HTMLInputElement) with name submit in the form. That's why document.getElementById('ss-form').submit is not a function but an object.

So, you get the following error:

TypeError: object is not a function

The solution is to remove that element. We should be careful to verify if browser thinks it's an element and not a function:

if (typeof document.getElementById('ss-form').submit === "object") {
    document.getElementById('ss-form').submit.remove();
}
document.getElementById('ss-form').submit();

answered Jun 23 '14 at 16:23

Ionică Bizău

109,027
88
289
474

1

Nailed it! I thought I had checked that... because I recall seeing that issue elsewhere. Needless to say, thanks for all the help... spent way too long scratching my head on this one. – Adjit Jun 23 '14 at 16:26
Cool, take a look at this question as well: http://stackoverflow.com/q/833032/1420197 – Ionică Bizău Jun 23 '14 at 16:30
Thats exactly where I saw it when I was looking how to programmatically submit a form. Don't know why I didn't realize it sooner. – Adjit Jun 23 '14 at 16:33

Cannot programmatically submit form

1 Answers1

Linked