单击警报框上的取消后，ajax 调用仍会发布到数据。为什么？答案

【问题标题】：ajax call still posts to the data after clicking Cancel on alert box. Why?单击警报框上的取消后，ajax 调用仍会发布到数据。为什么？
【发布时间】：2017-08-06 07:37:57
【问题描述】：

当单击提交按钮时，我有几个 ajax 调用通过 web 方法将数据发布到数据库。

当用户单击提交按钮时，会弹出一个警告框，要求用户在提交到数据库之前验证他/她的订单。

当一切正常并且用户点击提交按钮时，数据就成功发布到数据库了。

这部分工作正常。

问题是当用户单击“取消”时，数据仍会发布到数据库，尽管这一次，空白记录会发布到数据库。

我的问题是为什么当用户点击取消时数据仍然被发布？

单击“取消”选项不应触发 ajax 调用。

我错过了什么？

这里是相关代码。如果需要，将提供更多代码。

function getAllCreditorData() {
        var data = [];
        $('tr.data-contact-person8').each(function () {
                var creditname = $(this).find('.creditorname01').val();
                var creditaddress = $(this).find('.creditoraddress01').val();
                var creditincome = $(this).find('.creditorincome01').val();
                var alldata = {
                        'myCreditorname': creditname,
                        'myCreditoraddress': creditaddress,
                        'myCreditorincome': creditincome
                }
                data.push(alldata);
        });
        console.log(data);
        return data;
}

$("#btnSubmit").click(function (event) {
        event.preventDefault();
        if (confirm('Please review your order before submitting. Click Ok to submit; Cancel to make additional changes')) {
                var empComplete = false, sourceComplete = false, spouseComplete = false, dividentComplete = false, reimbursedComplete = false, honorariaComplete = false, giftComplete = false, orgComplete = false, creditorComplete = false;
                function checkComplete() {
                        if (empComplete && sourceComplete && spouseComplete && dividentComplete && reimbursedComplete && honorariaComplete && giftComplete && orgComplete && creditorComplete) {
                                $("#result").text("Thank you! You have successfully completed this form");
                        }
                }
        }
        $("#result").text("");
        var data = JSON.stringify(getAllEmpData());
        console.log(data);
        $.ajax({
                url: 'disclosures.aspx/SaveEmpData',
                type: 'POST',
                contentType: 'application/json; charset=utf-8',
                data: JSON.stringify({ 'empdata': data }),
                async: false,
                success: function () {
                        empComplete = true;
                        checkComplete();
                },
                error: function () {
                        alert("Error while inserting data");
                }
        });

感谢您的帮助

【问题讨论】：

快速浏览一下，您的POST 似乎在if 块之外，confirm 在
感谢您的帮助。很好的抓住戴夫！

标签： javascript jquery html asp.net ajax

【解决方案1】：

您的 ajax 调用超出了您的 if 条件。

$("#btnSubmit").click(function (event) {
    event.preventDefault();
    if (confirm('Please review your order before submitting. Click Ok to submit; Cancel to make additional changes')) {
        $.ajax({
            url: 'disclosures.aspx/SaveEmpData',
            type: 'POST',
            contentType: 'application/json; charset=utf-8',
            data: JSON.stringify({ 'empdata': data }),
            async: false,
            success: function () {
                    empComplete = true;
                    checkComplete();
            },
            error: function () {
                    alert("Error while inserting data");
            }
    });

            var empComplete = false, sourceComplete = false, spouseComplete = false, dividentComplete = false, reimbursedComplete = false, honorariaComplete = false, giftComplete = false, orgComplete = false, creditorComplete = false;
            function checkComplete() {
                    if (empComplete && sourceComplete && spouseComplete && dividentComplete && reimbursedComplete && honorariaComplete && giftComplete && orgComplete && creditorComplete) {
                            $("#result").text("Thank you! You have successfully completed this form");
                    }
            }
    }
    $("#result").text("");
    var data = JSON.stringify(getAllEmpData());
    console.log(data);

【讨论】：

这很快，而且工作完美。谢谢！根据 SO 消息，我将在 7 分钟内接受。
@kenny 很高兴我能帮上忙。

【解决方案2】：

您应该将 $ajax 代码包含在 if 语句中，该语句要求用户确认（）他们是否要提交。

您的 if 语句检查用户确认。但是 ajax 的代码调用我们不在 if 语句括号内。它在他们之外。因此，无论该语句是否为真，它都会运行。

-RH

【讨论】：