Intercept a form submit with jQuery and prevent or allow submission

Goal: Intercept a form submit, find out what submit button was clicked/invoked and decide to prevent the submission or continue to submit.

Solution:

$(document).ready(function() {
    $("form").submit(function(e) {
        if (e.originalEvent.explicitOriginalTarget.id == "myButton") {
            if (some status is true continue to submit the form)
                return true;
                //If the status above is false continue to prompt the user if they want to submit or not
            var ok = confirm('Do you really want to save your data?');
            if (ok) {               
                return true;
            }
            else {
                //Prevent the submit event and remain on the screen
                e.preventDefault();
                return false;
            }
        }
    });

    return;
});

Print | posted @ Wednesday, September 9, 2009 10:33 AM

Comments on this entry:

Gravatar # re: Intercept a form submit with jQuery and prevent or allow submission
by iririr at 10/14/2009 5:35 PM

Thanks for this, it really helped me out...couldn't find it anywhere else.
Gravatar # re: Intercept a form submit with jQuery and prevent or allow submission
by emi at 10/19/2009 10:31 AM

Thanks a lot!! This is the only page I've found with the trick e.originalEvent.explicitOriginalTarget . Very useful!!
Gravatar # re: Intercept a form submit with jQuery and prevent or allow submission
by raghu at 2/12/2010 8:02 AM

Thank u sooo much.
Awesome code, every web developer required this code....
Gravatar # re: Intercept a form submit with jQuery and prevent or allow submission
by franek at 3/16/2010 9:04 AM

Does it works with all browsers?

(BTW: ie6, ie7, ie8 SUCKS!!!)
Gravatar # re: Intercept a form submit with jQuery and prevent or allow submission
by emi at 6/1/2010 6:01 PM

For a cross-browser solution you should look at other properties:

// Look for the originating object for: firefox, others
// (opera, chrome -not tested, ...), IE
// Not working for, at least, konqueror. Safari not tested.
var submitted =
e.originalEvent.explicitOriginalTarget ||
e.originalEvent.relatedTarget ||
document.activeElement;

// Look if it was a text node (IE bug)
submitted = submitted.nodeType == 1 ?
submitted :
submitted.parentNode;
Gravatar # re: Intercept a form submit with jQuery and prevent or allow submission
by Office 2010 at 12/9/2010 4:06 AM

Too nice,!!! Your blog have lot of nice stuff to take a good read it is a nice blog. I liked each and every your photo which You showed me and I want to have more from this and I must like to thank along with my Sales Resumes.
Gravatar # re: Intercept a form submit with jQuery and prevent or allow submission
by Jamie Murphy at 2/10/2012 5:14 AM

Great snippet of code! very useful and extremely simple to customise!
Gravatar # re: Intercept a form submit with jQuery and prevent or allow submission
by Used Nissan Murano at 6/1/2012 3:26 AM

Too nice,!!! Your blog have lot of nice stuff to take a good read it is a nice blog. I liked each and every your photo which You showed me and I want to have more from this and I must like to thank along with my Sales Resumes.
Gravatar # re: Intercept a form submit with jQuery and prevent or allow submission
by Peter at 8/28/2012 5:30 AM

Both solutions doesn't work in Chrome and Safari.

It works in Opera, IE 9, Firefox 14.x.
Gravatar # re: Intercept a form submit with jQuery and prevent or allow submission
by Pandi at 2/14/2013 2:25 PM

a simple return false; can do the job when button is clicked using jquery, nice tip
Gravatar # re: Intercept a form submit with jQuery and prevent or allow submission
by timoy at 2/19/2013 4:09 AM

thanks! save me!
Gravatar # re: Intercept a form submit with jQuery and prevent or allow submission
by Adam at 1/24/2014 4:41 AM

Was banging my head against a brick wall all morning until i found this code. Helped me with what I needed to do
Gravatar # re: Intercept a form submit with jQuery and prevent or allow submission
by Blubvis at 4/25/2014 6:18 PM

Thanks for the script is used it to freeze the screen to prevent second submit/user input when posting
Post A Comment
Title:
Name:
Email:
Comment:
Verification: