Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

onchange="this.form.submit()" versus two submit buttons

With a pulldown triggering an onchange event to submit, it fails to work when two input submit buttons are present. It makes sense, so how do you specify exclusively which submit button to process?

<form>
<select onchange="this.form.submit()"></select>
<input type="submit" name="submit1" id="submit1" value="Submit 1" />
<input type="submit" name="submit2" id="submit2" value="Submit 2" />
</form>

Solution Using the suggestion from below, this code will work so that the second submit button will execute if the onchange is trigged from the pulldown:

<form>
<select onchange="var e=document.getElementById('killbox'); var s=document.getElementById('submit1'); e.removeChild(s); this.form.submit();"></select>
<div id="killbox"><input type="submit" name="submit1" id="submit1" value="Submit 1" /></div>
<input type="submit" name="submit2" id="submit2" value="Submit 2" />
</form>

This is in a basic form, certainly doesn't hurt to throw the Javascript in to a function instead of using inline Javascript for the onchange.

like image 557
Exit Avatar asked Nov 29 '11 18:11

Exit


People also ask

Can I have two or more Submit buttons in the same form?

yes, multiple submit buttons can include in the html form. One simple example is given below.

How can I use multiple submit buttons in an HTML form?

Let's learn the steps of performing multiple actions with multiple buttons in a single HTML form: Create a form with method 'post' and set the value of the action attribute to a default URL where you want to send the form data. Create the input fields inside the as per your concern. Create a button with type submit.

Why is Onchange not working?

onchange is not fired when the value of an input is changed. It is only changed when the input's value is changed and then the input is blurred. What you'll need to do is capture the keypress event when fired in the given input. Then you'll test the value of the input against the value before it was keypressed.


2 Answers

I'm pretty sure you can simply call .submit() on the button itself: document.getElementById('submit1').submit()

-edit-

Solution two: just remove one of the buttons (use removeChild(), which is a common DOM method).

like image 123
Tom van der Woerdt Avatar answered Oct 17 '22 21:10

Tom van der Woerdt


You could fire a click event on the button you want to use to submit. It feels weird, but it should work.

like image 44
Mathletics Avatar answered Oct 17 '22 22:10

Mathletics