How do I handle Two Submit buttons on One Form?

Question

I have two submit buttons and one form. How do I check what submit button was selected in my jquery code?

<% using (Html.BeginForm("UserInfo", "Home", FormMethod.Post, new { id  = "formNext" })) { %> 
.... 
<input id="submitHome" type="submit" name="goHome" value="Home" />  
<input id="submitNext" type="submit" name="getNext" value="Next" /> 
<% } %>


$(document).ready(function() {       
$('#formNext').submit(function() {      
        //Code Does not work but looking at something like this...
        //$('#submitHome').click(function() {
        //      navigate to Home;
        //});
        //$('#submitNext').click(function() {
        //      return true;
        //});
    });
});

Answer 1

$('#submitHome').click(function() {
      //navigate to Home;
});
$('#submitNext').click(function() {
      return true;
});

These should work if you pull them outside of the form.submit(). (right now those handlers are being attached after the form is submitted, which is too late since the click has already occurred)

Answer 2

You can try something like this

$(function() {
 var buttonpressed;
 $('input[type=submit]').click(function() {
      buttonpressed = $(this).attr('name')
 })
 $('form').submit(function() {
      alert('button clicked was ' + buttonpressed)
        buttonpressed=''
    return(false)
 })
})

Source: https://forum.jquery.com/topic/determining-which-of-two-submit-buttons-were-clicked-in-a-single-form