Whats the easiest way to reactive a submit() action that was cancelled with 'return false'

Question

I have some image buttons that have jQuery event handlers attached to them.

I want to make an AJAX call in the click() event to determine if the action should actually be allowed. Because I am doing an async ajax call I have to return 'false' to immediately cancel the event and wait for the response.

$('[id^=btnShoppingCartStep_]').click(function() {

 var stepName = this.id.substring("btnShoppingCartStep_".length);

 $.ajax({
            type: "POST",
            url: $.url("isActionAllowed"),
            data: "requestedStep=" + stepName,
            dataType: "json",

            success: function(data) {

                if (data.allowed) {

                    // need to resume the action here
                }
                else {
                    AlertDialog(data.message, "Not allowed!");
                }

            }

        });

        return false;
    });

I need to find the best way to resume the click event if the AJAX call determines that it should be allowed.

Any way of doing this that I can come up with seems clumsy, such as :

1) remove event handler from the buttons

2) simulate a click on the button that was clicked

Is there any nice way of doing this that I'm missing?

Answer 1

Assign an ID to your form. Let's say you name it myForm. Where your // need to resume the action here is, use this:

$("#myForm").trigger("submit");

Answer 2

1) Simply call the form's submit() method.

$("#FormID").submit();

2) Also, if what you want is to intercept form submissions for that for, you may want to do this slightly differently (e.g. if you can submit the form via >1 button):

$("form").submit(function() {
  ...

Answer 3

How long does it take to confirm the validity of the request? What else would be the user be doing during that time?

Why not have the server do the validation? Is that too risky? You could simply pass the data along to the server, have it determine if it's valid. If it's not, it tells Ajax "not allowed", the function alerts the user. If it liked the data, there is no need to resume the action as it's already done.

Answer 4

if you need submit form:

$('#form_id').submit();

if you need continue this function:

var allowed_actions = {};

$('[id^=btnShoppingCartStep_]').click(function() {

var stepName = this.id.substring("btnShoppingCartStep_".length);
var $click_me_again = $(this);

if (!allowed_actions[stepName]) {
  $.ajax({
          type: "POST",
          url: $.url("isActionAllowed"),
          data: "requestedStep=" + stepName,
          dataType: "json",

          success: function(data) {

            if (data.allowed) {

                // need to resume the action here
                allowed_actions[stepName] = true;
                $click_me_again.click();
            }
            else {
                AlertDialog(data.message, "Not allowed!");
            }

          }

      });
      return false;
    } // end if
    // continue function (check passed)
});