Search code examples
jqueryformsonsubmitjquery-blockui

How to prevent jQuery BlockUI from triggering


I made jQuery BlockUI Plugin to be triggered on every form submit action:

$("form").submit(function() {
    jQuery.blockUI();
});

I want to validate some of the forms before they are submitted:

<form method="POST" onSubmit="return(confirm('Really submit?'));">

When I hit "Cancel" on the confirm popup box, the BlockUI gets triggered and blocks the interface. It never gets unblocked.
Here's an example: http://jsfiddle.net/8B8yA/.

The question is how to prevent BlockUI from getting triggered when "Cancel" is pressed.

I've tried adding $.unblockUI() to "Cancel" action:

if(!confirm("Really submit?")) {
    $.unblockUI();
    return(false);
}

but it obviously does not work, as the unblock action is called before the block action is.


Solution

  • How about:

    $("form").submit(function() {
        if(!$(this).hasClass('skip'))
        jQuery.blockUI();
    });​
    

    and

    <html>
      <head>
        <script src="http://malsup.github.com/jquery.blockUI.js">
        </script>
      </head>
      <body>
        <form method="POST" onSubmit="return (function(form) { var c = confirm('Are you sure?'); if(!c) { $(form).addClass('skip'); } return c; })(this);">
          <input type="submit">
        </form>
      </body>
    <html>​
    

    See: http://jsfiddle.net/8B8yA/5/