如何订购此jQuery tha运行ajax,然后必须返回true

詹姆斯·威尔逊

我有一个非常简单的JavaScript,用于表单验证,可以检查我的表单字段。该函数将建立一个errorList变量并返回false,如果该变量为空,则该函数将返回true并提交。

我在此验证功能中添加了新层。现在,我想调用一个外部函数,该函数仅发送带有所有表单验证的Ajax请求,然后通过电子邮件向我发送电子邮件,询问用户是否通过了表单验证。

当表单不通过验证时,例如当我返回false时,调用此外部函数很好。显然,表单没有提交,因此允许ajax完成。

我只是无法弄清楚如何触发外部函数,让它完成,然后返回true并让表单提交。它只是跳过了ajax请求。

有人可以帮忙逻辑吗?

验证功能:

if (errorList.length > 0) {

    // Log the errors in quote.shared.js:
    logValidationErrors("N/A - Pre Quote", $("#prequote-form"), "productname", errorList);

    $("#error-list").html("");
    $("#error-list").append(errorList);
    $("#error-div").slideDown(500, function() {
        $( '#error-div' ).ScrollTo(300);
    });
    return false;
} else {

    // Log the valid passing through this function in quote.shared.js:
    logValidationErrors("N/A - Pre Quote", $("#prequote-form"), "productname", "none"); 
    return true;
}

Ajax函数:

// logValidationErrors
function logValidationErrors(xOrderNumber, xForm, xProduct, xErrors) {
    /*
    alert(xOrderNumber);
    alert(xForm);
    alert(xProduct);
    alert(xErrors);
    */

    $.ajax({
        url:    "log-clientside-events.php?" +
                "type=javascript-errors&" +
                "ordernumber=" + xOrderNumber + "&" +
                "formvalues=" + encodeURIComponent(xForm.serialize()) + "&" +
                "product=" + xProduct + "&" +
                "errors=" +  encodeURIComponent(xErrors),
        context: document.body,
        cache: false,
        timeout: 10000,
        success: function(sHTML){

        },
        error:function (xhr, ajaxOptions, thrownError){
            //window.location.href = window.location.href;
        }
    });


}

Anup帮助解决方案。关键是创建一个“标志”变量,该变量在Ajax第一次运行时为false,然后在ajax完成时将其设置为true,然后再次提交表单,然后“ flag”检查第二次跳过Ajax阶段-并返回true。

if (errorList.length > 0) {

    // Log the errors in quote.shared.js:
    logValidationErrors("N/A - Customer Details", $("#customer-form"), "productname", errorList);

    $("#error-list").html("");
    $("#error-list").append(errorList);
    $("#customer-login-success-message").slideUp(100);
    $("#error-div").slideDown(500, function() {
        $( '#error-div' ).ScrollTo(300);
    });
} else {

    if (validationSuccessfullyLoggged) {
        return true;

    } else {
        // Log the valid passing through this function in quote.shared.js:
        logValidationErrors("N/A -  Customer Details", $("#customer-form"), "productname", "none"); 

    }
}

return false;

处理ajax的函数:

// logValidationErrors
var validationSuccessfullyLoggged = false;

function logValidationErrors(xOrderNumber, xForm, xProduct, xErrors) {
    /*
    alert(xOrderNumber);
    alert(xForm);
    alert(xProduct);
    alert(xErrors);
    */

    if (xErrors == "none") {
        xErrors = "<li>Form Validated Successfully</li>";   

        submitForm = true;
    } else { 
        submitForm = false;
    }

    $.ajax({
        url:    "log-clientside-events.php?" +
                "type=javascript-errors&" +
                "ordernumber=" + xOrderNumber + "&" +
                "formvalues=" + encodeURIComponent(xForm.serialize()) + "&" +
                "product=" + xProduct + "&" +
                "errors=" +  encodeURIComponent(xErrors),
        context: document.body,
        cache: false,
        timeout: 10000,
        success: function(sHTML){

            //alert(validationSuccessfullyLoggged);

            if (submitForm) { 
                validationSuccessfullyLoggged = true;
                xForm.submit();
            }
        },
        error:function (xhr, ajaxOptions, thrownError){
            //window.location.href = window.location.href;
        }
    });


}
安纳普

问题的一般原因是,当您发出AJAX请求时,它是异步的(AJAX中的第一个“ a”)。因此,在调用logValidationErrors函数之后,将在ajax操作返回之前运行return true。

为了解决这个问题,我可以想到2种通用方法(尽管可能我还没有想到其他方法):

1)在jQuery的ajax方法中,您可以将async设置为false(因此不再是异步的)。有关详细信息,请参见其文档:http : //api.jquery.com/jQuery.ajax/

我个人不建议这样做,除非是在非常特殊的情况下(并且我认为您的示例对我而言不合格),因为您锁定了一段时间的浏览器,并且达到了异步请求的目的。

2)一种选择是,您始终会从主JavaScript代码中返回false。换句话说,在调用logValidationErrors函数之后,也返回false(或者在if / else块之后只有一个return false语句。然后,当ajax操作实际上完成时,您要在成功处理程序中触发成功方案(例如,提交表单),并在错误情况下(请参见jQuery ajax文档中的error选项),您将要调用错误情况。

如果没有看到更多代码,或者在调用您发布的特定if / else示例时,我无法更精确地判断,可能是存在更优雅的处理方式。而且,根据您要执行的操作,可能还要记住其他注意事项。例如,如果提交表单只是要调用相同的if / else块,则可能需要一个跟踪变量来指示您已经发出了初始ajax请求,因此这次您可以继续进行并在需要时提交。

希望能有所帮助。

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

如何执行此数组(jQuery Ajax)?

来自分类Dev

如何循环此简单的jQuery动画3次然后停止?

来自分类Dev

在jQuery Ajax中返回true

来自分类Dev

如何使用LINQ选择然后选择订购?

来自分类Dev

如何在HTML上使用AJAX JQUERY打印此值

来自分类Dev

jQuery和Ajax。如何检索此字段的数据并返回到正确的复选框

来自分类Dev

如何订购以匿名类型返回的数据?

来自分类Dev

如何订购以JSON格式返回的商品?

来自分类Dev

如何使此jQuery ajax函数与jQuery 1.12.x一起使用

来自分类Dev

如何运行此代码?

来自分类Dev

如何运行此查询?

来自分类Dev

单击html表内的超链接时,如何避免运行此jQuery代码?

来自分类Dev

如何使用jQuery访问此JSON(p)返回值中的突出显示变量

来自分类Dev

如何在不使用jQuery但使用纯Javascript的情况下使用AJAX提交此表单

来自分类Dev

如何在ajax jquery中添加$ _POST ['submit']或执行此操作的最佳方法是什么?

来自分类Dev

我将如何在香草JS中执行此Ajax jQuery?

来自分类Dev

如何在不使用jQuery但使用纯Javascript的情况下使用AJAX提交此表单

来自分类Dev

如何使我的Ajax轮询仅运行5次然后终止

来自分类Dev

如何使此查询运行更快

来自分类Dev

如何使此循环运行更快?

来自分类Dev

如何运行此MySQL查询?

来自分类Dev

如何运行此SELECT查询?

来自分类Dev

如何自动运行此代码

来自分类Dev

如何运行此.sh脚本?

来自分类Dev

如何运行此命令SSJS

来自分类Dev

我如何运行此代码

来自分类Dev

如何成功运行此命令

来自分类Dev

如何简化此jQuery?

来自分类Dev

如何返回此函数的结果?