Question

Can I intercept/interrogate the form submission values using jQuery in the $('#formid').submit(function() { }); call? I can’t check the value from the page as it’s the particular submit button pressed that I need to check. I’ve found this Link and it works in FF, but not in IE8, so that doesn’t help, unfortunately. I also don’t want to have to attach submit code to the buttons as I was hoping to make a generic bit of code I could plug into a whole set of forms.

Cheers

MH

Answer 1

The latest jQuery 1.4 supports ‘live’ for submit events now — meaning you don’t have to attach individual handlers to all your forms. A nice example that covers what you’ve asked is given by Paul Irish here:

http://jquery14.com/day-05/jquery-1-4-hawtness-1-with-paul-irish

Here’s my own take:

jQuery(document).ready(function() {

  var pageForms = jQuery('form');

  pageForms.find('input[type="submit"]').live('click', function(event) {
    var submitButton = this;
    var parentForm = jQuery(jQuery(this).parents('form')[0]);
    parentForm.data('submit-button',submitButton);
  });

  pageForms.live('submit', function(event) {

    // Prevent form-submission. You can do this conditionally later, of course
    event.preventDefault();

    // The form that was submitted
    var theForm = jQuery(this);

    // Detect which submit button was pushed
    var submitButton = theForm.data('submit-button');
    console.log('submitButton = ',submitButton.value);

  });

});

HTML:

<form>
  <input type="submit" value="submit form 1" />
</form>

<form>
  <input type="submit" value="submit form 2" />
  <input type="submit" value="submit form 3" />
</form>

http://jsbin.com/equho3/6/edit

EDIT – Sorry, I posted an example here that matched the one in your link! I’ve now provided a cross-browser solution.