Retrieving a submit form for a submit event

Question

I have a form on which there are several buttons. Two buttons use ajax to submit the form and clear it so that the user can add a few entries before moving on. The last button is for when the user has completed this page and wants to go to the next page. Is it possible in the jQuery.submit () method to indicate how the form was submitted (pressing enter or receiving the object of the pressed button)?

Answer 1

Not sure if these are best practices, but I found that if I create a dispatch event handler and then create handlers for other buttons, this seems to work fine, at least in Chrome.

Here is an example

$(function(){
    $('form#frmField').submit(function(evt){
        alert('Form Submitted');
        return false;
    });

    $('input#btnReset').click(function(){
        alert('Form Reset');
        return false;
    });
});

Answer 2

You can define onclick event handlers for your buttons that would save the state in any global variable. Then you check the state of the variable in the onsubmit handler.

http://jsfiddle.net/archatas/6dsFc/

Answer 3

:

HTML:

<form id="myform">
    <input type="text" id="text1" name="text1" /><br />
    <input type="button" class="button-submit" id="b1" name="b1" value="send 1" /><br />
    <input type="button" class="button-submit" id="b2" name="b2" value="send 2" /><br />
    <button class="button-submit" id="b3">send 3</button>
</form>

<br />
<div id="data"></div>

JS:

$('#myform').bind('submit', function(event, from) {

    if(from)    
       $('#data').append("from :" + $(from).attr('id') + '<br />');

    return false;

});

$('#myform').keypress(function(event) {

  if (event.which == '13') {
     event.preventDefault(); //preventDefault doesn't stop further propagation of the event through the DOM. event.stopPropagation should be used for that.
     event.stopPropagation();
     $(this).trigger('submit', [this]); 
     return false; 
  }

});

$('.button-submit').bind('click', function(event) { 
    event.stopPropagation();
    $('#myform').trigger('submit', [this]); 
    return false; 
});

event.preventDefault

Answer 4

jQuery . , , .

, e , e.type, click e.which, , , 13.

You can use targetto find out which DOM element initiated sending with e.target.

So,

jQuery('#foo').click(function(e){
var initiator = $(e.target); //jQuery object for the DOM element that initiated the submit
if(e.type==="click")
{
//is a click
}
else if(e.which==="13")
{
//is an 'enter' triggered submission
}
});

});