在 ASP.NET 中将 Javascript Bootbox 与 Ajax.BeginForm 一起使用

Question

在查看页面中：

@using (Ajax.BeginForm("UpdateAccount", "AccountInfo", new AjaxOptions {
    HttpMethod = "POST",
    AllowCache = false,
    OnSuccess = "accountUpdateRequestSuccess",
    OnFailure = "formSubmissionFailed",
    OnBegin = "validateAccountInformation"
}))

validateAccountInformation 函数说明如下：

function validateAccountInformation() {
if (error.length > 0) {
    showErrorNotification(errorListHtml);
    return false;
}
else {
    if ( Some Conditions ) {
        bootbox.confirm({
            title: "Confirm",
            size: "medium",
            message: "Some Message",
            callback: function (result) {
                if (result) {
                    Some Code
                }
                else {
                    Some Code
                }
            }
        });
    }        
}

单击“保存”按钮时，首先调用 validateAccountInformation 函数。如果没有错误，它将引发一个 Bootbox。如果单击 Bootbox OK 按钮，它将提交具有特定值的表单，或者如果单击 Bootbox CANCEL 按钮，它将提交具有与以前不同的特定值的表单。

现在，我面临的问题是，当用户单击“保存”按钮时，它会转到 validateAccountInformation 函数。如果没有错误，它会调用 Bootbox.Confirm。我期望在 Bootbox 中单击某些 OK/CANCEL 按钮之前，将保留表单提交。但它不会等待 Bootbox。意味着永远不会调用 Bootbox 回调函数。这可能与 AJAX 异步有关。

我使用了javascript确认方法。而且这个方法确实持有表单提交。

function validateAccountInformation() {
    if (error.length > 0) {
        showErrorNotification(errorListHtml);
        return false;
    }
    else {
        if ( Some Conditions ) {
            if (confirm("check")) {
                some code
            }
        }
    }
}

有什么方法可以让我按照上述方案将 Bootbox 确认框与 Ajax Begin Form 一起使用？

Answer 1

我改变了流程并且能够集成 Bootbox。我所做的是，我省略了 onBegin 函数。所以我的视图页面看起来像这样

@using (Ajax.BeginForm("UpdateAccount", "AccountInfo", new AjaxOptions {
     HttpMethod = "POST",
     AllowCache = false,
     OnSuccess = "accountUpdateRequestSuccess",
     OnFailure = "formSubmissionFailed",
 }))

现在我添加了一个函数，该函数由此表单峰会按钮的 onclick 事件触发。并在该函数内集成了validateAccountInformation函数和Bootbox。现在重要的是，这个函数总是 returns false。通过返回 false，我设法保留了表单提交。现在 onClick 事件函数看起来像

$(document).on('click', '#btn-edit-account-save', function () {
     var submit = validateAccountInformation(); 
     some code   
     if (submit == true) {
         if (some condition) 
         {
             $('Form').submit();
         }
         else 
         {
             bootbox.confirm(
             {
                 title: "Confirm",
                 size: "medium",
                 message: "Some Message",
                 callback: function (result) 
                 {
                     if (result) 
                     {
                         $('Form').submit();
                     }
                     else 
                     {
                         some code
                     }
                 }
             });
         } 
     }
     return false;
});

在 ASP.NET 中将 Javascript Bootbox 与 Ajax.BeginForm 一起使用

Using Javascript Bootbox with Ajax.BeginForm In ASP.NET

asp.net-mvc

asp.net-ajax

ajaxform

bootbox