Как получить ненавязчивый удаленный валидатор jquery для выполнения async..?

Я немного опоздал к столу, но я наткнулся на этот вопрос, пытаясь решить подобную проблему. Я тоже не хотел использовать Interval, поэтому я приготовил другое решение и подумал, что это может быть полезно для других.

в конце концов я решил переопределить методы jQuery validator startRequest и stopRequest, чтобы добавить свою собственную логику. После выполнения моей собственной логики я просто вызываю старые методы валидатора.

// Extend jQuery validator to show loading gif when making remote requests
var oldStartRequest = $.validator.prototype.startRequest;
$.validator.prototype.startRequest = function (element) {
    var container = $('form').find("[data-valmsg-for='" + element.name + "']");
    container.addClass('loading');       

    oldStartRequest.apply(this, arguments);
};

var oldStopRequest = $.validator.prototype.stopRequest;
$.validator.prototype.stopRequest = function (element) {
    var container = $('form').find("[data-valmsg-for='" + element.name + "']");
    container.removeClass('loading');

    oldStopRequest.apply(this, arguments);
};

Все I для моих целей было просто добавить класс css "загрузка" в соседнее поле сообщения проверки, чтобы показать загрузочный gif, но вы можете легко расширить это, чтобы включить/отключить кнопку и т. д.

var iIntervalId = null;

//
// DECLARE FUNCTION EXPRESSIONS
//

//==============================================================================
// function that triggers update when remote validation completes successfully
//==============================================================================
var fnPendingValidationComplete = function () {

  var validator = $("#frmProductType").data("validator");
  if (validator.pendingRequest === 0) {

    clearInterval(iIntervalId);

    //Force validation to present to user (this will not retrigger remote validation)
    if ($("#frmProductType").valid()) {

      alert("valid - you can submit now if you like");

    }
    //else { alert("invalid"); }
  }
  //else { alert("NOT YET"); }
},

//==============================================================================
// Trigger validation
//==============================================================================
fnTriggerValidation = function (evt) {

  //Remove any cached values to ensure that remote validation is retriggered
  $("#txtProductType").removeData("previousValue");

  //Trigger validation
  $("#frmProductType").valid();

  //Setup interval which will evaluate validation (this approach because of remote validation)
  iIntervalId = setInterval(fnPendingValidationComplete, 50);
};

fnTriggerValidation();

Я в конечном итоге решил это, но кнопка disable / wait image show происходит только тогда, когда есть действительная отправленная форма. Это нормально, хотя, поскольку несколько недопустимых представлений формы являются идемпотентными, пользователь может щелкнуть столько, сколько захочет. (Кроме того, метод действия удаленной проверки кэшируется по его значениям параметров.)

$(function () {
    $('form').bind('invalid-form.validate', function () {
        $('form').each(function () {
            $(this).find(
                '[data-app-form-submitting-icon="true"]').hide();
            var button = $(this).find(
                'input[type="submit"][data-app-form-submit-button="true"]');
            setTimeout(function () {
                button.removeAttr('disabled');
            }, 1);
        });
    });
    $('form').live('submit', function (e) {
        $(this).find('[data-app-form-submitting-icon="true"]').show();
        var button = $(this).find(
            'input[type="submit"][data-app-form-submit-button="true"]');
        setTimeout(function () {
            button.attr('disabled', 'disabled');
        }, 0);
    });
});

Это тоже немного хаки, но когда я не использовал setTimeout, действие submit никогда не запускало недопустимый обработчик.