jQuery什么时候完成

时间:2016-06-09 18:23:22

标签: jquery ajax .when

我正在尝试验证两次调用数据库的字段。它进入数据库并验证其是真还是假。我需要链接一些AJAX调用才能执行此操作。我使用.when.then.done来执行此操作,但它似乎无法正常工作。

var Validate = function () {
        var isValid = true;
        $errorList.find('li').remove();
        $lblAError.text('');

        $.when(ParcelValidate(isValid))
            .then(AccountValidate(isValid))
            .done(function () {
            return isValid
        });
    };

    var ParcelValidate = function (isValid) {
        return $.ajax({
            url: "../WebServices/ParcelMasterWebService.asmx/IsParcelActive",
            method: "POST",
            data: JSON.stringify({ "pin": $parcID.val() }),
            contentType: 'application/json; charset=utf-8',
            datatype: 'json',
            success: function (data) {
                if (!data.d) {
                    isValid = false;
                    $lblPError.text('!').css(({ "color": "red" }));
                    $errorList.append('<li>Parcel must be on record.</li>').css(({ "color": "red" }));
                }
            },
            fail: function () {
                isValid = false;
                $lblPError.text('!').css(({ "color": "red" }));
                $errorList.append('<li>Unexpected error occured!</li>').css(({ "color": "red" }));
            }
        })
    }
    var AccountValidate = function (isValid) {
        return $.ajax({
            url: "../WebServices/FireProtectMasterWebService.asmx/isAccountActive",
            method: "POST",
            data: JSON.stringify({ "accountID": $parcID.val() }),
            contentType: 'application/json; charset=utf-8',
            datatype: 'json',
            success: function (data) {
                if (data.d) {
                    isValid = false;
                    $lblPError.text('!').css(({ "color": "red" }));
                    $errorList.append('<li>Cannot have duplicate Parcels.</li>').css(({ "color": "red" }));
                }
            },
            fail: function () {
                isValid = false;
                $lblPError.text('!').css(({ "color": "red" }));
                $errorList.append('<li>Unexpected error occured!</li>').css(({ "color": "red" }));
            }
        })
    }

2 个答案:

答案 0 :(得分:0)

你有几个问题,第一个是验证函数没有返回任何东西,因为你正在进行异步调用你的函数应该返回一个promise而不是返回一个布尔值,最好拒绝/解决这个承诺,你的代码看起来像这样:

var Validate = function () {
    $errorList.find('li').remove();
    $lblAError.text('');
    var promise = $.Deferred();

    ParcelValidate(promise).then(AccountValidate(promise));

    return promise;
};

var ParcelValidate = function (promise) {
    return $.ajax({
        url: "../WebServices/ParcelMasterWebService.asmx/IsParcelActive",
        method: "POST",
        data: JSON.stringify({ "pin": $parcID.val() }),
        contentType: 'application/json; charset=utf-8',
        datatype: 'json',
        success: function (data) {
            if (!data.d) {
                $lblPError.text('!').css(({ "color": "red" }));
                $errorList.append('<li>Parcel must be on record.</li>').css(({ "color": "red" }));
                promise.reject(false);
            }
        },
        fail: function () {
            $lblPError.text('!').css(({ "color": "red" }));
            $errorList.append('<li>Unexpected error occured!</li>').css(({ "color": "red" }));
            promise.reject(false);
        }
    })
}
var AccountValidate = function (promise) {
    return $.ajax({
        url: "../WebServices/FireProtectMasterWebService.asmx/isAccountActive",
        method: "POST",
        data: JSON.stringify({ "accountID": $parcID.val() }),
        contentType: 'application/json; charset=utf-8',
        datatype: 'json',
        success: function (data) {
            if (data.d) {
                $lblPError.text('!').css(({ "color": "red" }));
                $errorList.append('<li>Cannot have duplicate Parcels.</li>').css(({ "color": "red" }));
                promise.reject(false);
            }
            promise.resolve(true);
        },
        fail: function () {
            $lblPError.text('!').css(({ "color": "red" }));
            $errorList.append('<li>Unexpected error occured!</li>').css(({ "color": "red" }));
            promise.reject(false);
        }
    })
}

现在无论调用validate还是等待promise并相应地对完成/失败方法作出反应,即:

Validate().done(function(){/*valid*/}).fail(function(){/*not valid*/})

最后一件事,因为它是您的代码,因为您将isValid作为参数传递,更改该值不会修改原始函数的isValid值。

答案 1 :(得分:0)

我想解决的问题是,如果我从一个ajax调用中获得true,或者从另一个调用中获取false,则我想拒绝click事件。我遇到的问题是,它会运行所有这些并返回启动它的事件,一旦我从服务器得到答案,它将达到我的回报,但不会回到事件。该事件已经以值true关闭,并运行我的其他代码段,即使我得到的答案是错误的。

为了解决这个问题,我添加了另一个按钮,让他们点击隐藏asp控件并让新按钮运行验证。当我从ajax得到回复时,我验证了返回的内容并告诉JavaScript单击asp控件来触发事件。不是最优雅或最恰当的方式,但它有效。

var Validate = function (Filter) {
    $errorList.find('li').remove();
    $lblAError.text('');
    var promise = $.Deferred();
    var hdnbtn = document.getElementById('btnInsert');

    $.when(ParcelValidate()).then(function (data) {
        if (data.d) {
            $.when(AccountValidate()).then(function (data2) {
                if (data2.d) {
                    $lblPError.text('!').css(({ "color": "red" }));
                    $errorList.append('<li>Cannot have duplicate Parcels.</li>').css(({ "color": "red" }));
                } else {
                    hdnbtn.click();
                }
            })
        }
        else {
                $lblPError.text('!').css(({ "color": "red" }));
                $errorList.append('<li>Parcel must be on record.</li>').css(({ "color": "red" }));
            }
    })
};

var ParcelValidate = function () {
    return $.ajax({
        url: "../WebServices/ParcelMasterWebService.asmx/IsParcelActive",
        method: "POST",
        data: JSON.stringify({ "pin": $parcID.val() }),
        contentType: 'application/json; charset=utf-8',
        datatype: 'json',            
        fail: function () {
            $lblPError.text('!').css(({ "color": "red" }));
            $errorList.append('<li>Unexpected error occured!</li>').css(({ "color": "red" }));
            //promise.fail(false);
        }
    })
};
var AccountValidate = function () {
   return  $.ajax({
        url: "../WebServices/FireProtectMasterWebService.asmx/isAccountActive",
        method: "POST",
        data: JSON.stringify({ "accountID": $parcID.val() }),
        contentType: 'application/json; charset=utf-8',
        datatype: 'json',
        fail: function () {
            $lblPError.text('!').css(({ "color": "red" }));
            $errorList.append('<li>Unexpected error occured!</li>').css(({ "color": "red" }));                
        }
    })
}