在 Javascript 完成提交之前等待待处理的请求

Question

我在 Web 应用程序 (javascript-jQuery) 上遇到以下情况：

使用 https://jquerytools.org/
在表单中有一个来自 https://github.com/RobinHerbots/Inputmask 的 [required] 掩码输入（银行帐户），它会在发生更改事件时向服务器发出请求，并且在请求期间禁用输入以避免修改。

提交表单时，有时，当银行账户为空时，不会选中验证“必需”。经过疯狂的调试后，我看到输入掩码控件正在触发一个更改事件，因此，请求被抛给服务器（因此输入被禁用），并且验证器没有验证所需的，因为它有一个条件，即禁用的字段未被验证。

我想“暂停”验证，直到所有请求都完成，但我还没有找到在库外执行此操作的方法。关于如何在不修改外部库（“jquery inputmask”和“jquery tools”）的情况下解决此问题的任何想法？

Answer 1

最后我选择了以下解决方案：

表单提交时跟踪
跟踪何时有待处理的请求

按下提交按钮后，在提交前检查是否有待处理的请求。我使用 javascript 间隔每 200 毫秒检查一次（并且在最多 10 个间隔期间以避免错误跟踪导致未提交的表单）。

另一方面，我在服务器上发送规则请求之前检查表单是否正在提交。如果表单正在提交，我不计算规则。

我post代码适配明白了。

检查表单提交的函数：

// Check the form submit
$(".submitButtom", ctl).click(function (e) {
    var $form = $(this).closest('form');
    var areServerRulesRunning = $.mpm.formengine.genericRules.runningServerRules > 0;
    if (areServerRulesRunning) {
        // If are server rules running keep checking before submit
        var retries = 10;
        var interval = setInterval(function() {
            if ($.mpm.formengine.genericRules.runningServerRules <= 0 || retries < 0) {
                clearInterval(interval);
                // variable to track the submission of the form
                $.mpm.formengine.form.submitting = true;
                $form.submit();
            }
            retries--;
        }, 200);
    }
    else {
        $form.submit();
    }
});
// Later on a callback after submit (don't published): $.mpm.formengine.form.submitting = false;

在输入更改时执行服务器规则的函数：

...
// Rule execution
serverCalculationRule: function (wfName, $sourceInput, controlScope, ruleData) {

    if ($.mpm.formengine.form.submitting === true) {
        // If the form is submitting don't send the request to the server
        return;
    }

    $.mpm.formengine.genericRules.runningServerRules++;
    $.post($.mpm.Constants.FormEngine.UrlDoAction, doActionData,
        function (data) {
            // SUCCESS
        }
    )
    .always(function () {
        // ALWAYS
        $.mpm.formengine.genericRules.runningServerRules--;

    });
},
...

在 Javascript 完成提交之前等待待处理的请求

Wait pending requests before finalize submit on Javascript

javascript

jquery-tools

jquery-inputmask