Submit with javascript

Question

How can I specify which submit button to submit with?

The current example just submits the first submit button, with $("form").submit(); but how can I make it so it chooses the submit button by id or name?

<html>
<script>
$("form").submit();
</script>

<form action="<?=$_SERVER['PHP_SELF']?>" method="post" />

//other inputs


<input type="submit" value="Enter" name="enter" id="enter">
<input type="submit" value="Void" name="void" id="void">
<input type="submit" value="Refund" name="refund" id="refund">

</form>

</html>

@FabrícioMatté oops that was just a copy and paste typo, sorry. — Arian Faurtosh
– Arian Faurtosh, Commented Aug 7, 2013 at 22:40
No prob, back to the topic, a submit event triggered from JS does not send any submit button value from what I remember. I guess Blender's solution is your best shot, though I haven't tested it. — Fabrício Matté
– Fabrício Matté, Commented Aug 7, 2013 at 22:44

Blender · Accepted Answer · 2013-08-07 22:42:28Z

2

Simulate a click to that element:

$("#circle2").click();

Also, you don't need action="<?=$_SERVER['PHP_SELF']?>". Forms submit to the current page by default.

answered Aug 7, 2013 at 22:42

Blender

300k55 gold badges462 silver badges511 bronze badges

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

Comments

Sasanka Panguluri · Accepted Answer · 2013-08-07 22:43:57Z

1

First of all, why do you want to submit the same form with 3 different buttons? It is a bad structure. Your code also has all the 3 buttons with the "id" attribute which is included in the <input> tag twice.

Based on your question, I could figure out you would want the submit button to say different things under different conditions.

Have a single button like this :

<input type="submit" name="submit" value="Enter">

You could always change what your button says, or how it looks like with JQuery :

if(condition){
$('#submit').val('.....');
// You can also change more stuff as you want.
}

Then you would want to submit the form

$('#submit').click(function(e)){
e.preventDefault();
$('form').submit();
}

answered Aug 7, 2013 at 22:43

Sasanka Panguluri

3,1484 gold badges35 silver badges54 bronze badges

4 Comments

Blender Over a year ago

When you click a submit button, the POST request sent by the browser contains the name and value attributes of the button. Here, even if you had JavaScript turned off, you could enter, void and refund from the same form.

Sasanka Panguluri Over a year ago

Thank you, my answer applies when Javascript is on, since the user already has Javascript in his code.

Blender Over a year ago

Yes, but that's the whole problem. By submitting the form like this, you don't send that extra parameter.

Sasanka Panguluri Over a year ago

How about having a hidden input field that is set by PHP?

Nabil Kadimi · Accepted Answer · 2013-08-07 23:09:20Z

0

By id

You can select the element by id easily with $('#my_btn') and you can click on it using the jQuery method click().

By name (or any other attribute

Other attributes are a bit harded (but not complex) You select the element with $('input[name=some_name]')

Examlpe using your code

Here is an example which shows how you can get elements by name and click on them, click the submit buttons to see what happens: http://jsfiddle.net/nabil_kadimi/99v93/2/

answered Aug 7, 2013 at 23:09

Nabil Kadimi

10.5k2 gold badges56 silver badges60 bronze badges

Collectives™ on Stack Overflow

Submit with javascript

3 Answers 3

Comments

4 Comments

By id

By name (or any other attribute

Examlpe using your code

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

4 Comments

By id

By name (or any other attribute

Examlpe using your code

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related