时间戳

首页 > 解决方案 > 在 ASP.NET 中使用带有 Ajax.BeginForm 的 Javascript Bootbox

asp.net-mvc - 在 ASP.NET 中使用带有 Ajax.BeginForm 的 Javascript Bootbox

问题描述

在视图页面中：

@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 按钮，它将提交具有与以前不同的某些值的表单。

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

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

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

是否有某种方法可以按照上述方案将 Bootbox Confirmation 框与 Ajax Begin Form 一起使用？

标签： asp.net-mvcasp.net-ajaxajaxformbootbox

解决方案

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

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

现在我添加了一个由这个表单峰会按钮的 onclick 事件触发的函数。并在该函数内集成了 validateAccountInformation 函数和 Bootbox。现在重要的部分是，这个函数总是返回 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;
});

推荐阅读