Submit form with Javascript doesn't work

Question

I have a simple form for uploading a file. If I use an ordinary submit button, everything works as expected:

<form id="mainform" method="post" action="/" enctype="multipart/form-data">
...
<input type="submit" id="submit" value="Analyze File"/>
</form>

But if I change it to an ordinary button and use Javascript to submit the form, nothing happens:

<input type="button" id="submit" value="Analyze File" onclick="document.getElementById('mainform').submit()"/>

I verified that the onclick handler really is getting called, and looking up the form works correctly. For example, if I change it to onclick="alert(document.getElementById('mainform').action)", the alert comes up as expected and shows the target URL of the form. But for some reason, the call to submit() simply doesn't submit the form.

@kol: w3schools is not a good source for JavaScript code. Plus, how does his code differ from that? He's pretty much doing the same thing, — gen_Eric
– gen_Eric, Commented Sep 19, 2013 at 19:14

Joe Enos · Accepted Answer · 2013-09-19 19:19:53Z

10

The issue is your submit button. Its id is submit, which means that document.getElementById("mainform").submit represents the button with ID of submit, not the submit function.

You just need to change the ID for that button, and you're all good.

answered Sep 19, 2013 at 19:19

Joe Enos

40.6k11 gold badges86 silver badges144 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Jonathan Lonowski · Accepted Answer · 2013-09-19 19:26:54Z

5

You have a naming conflict between the .submit() method and the:

<input type="submit" id="submit" value="Analyze File"/>

By having that id, a reference to it is being assigned to the submit property of the <form>, which replaces the method.

If you rename the <input>, you should be able to .submit() as expected:

<input type="submit" id="mainform_submit" value="Analyze File"/>

edited Sep 19, 2013 at 19:26

answered Sep 19, 2013 at 19:21

Jonathan Lonowski

124k35 gold badges203 silver badges202 bronze badges

Collectives™ on Stack Overflow

Submit form with Javascript doesn't work

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related