Javascript 如何在AJAX调用中使用引导警报弹出窗口

在我的

MVC

项目中，我使用以下AJAX调用一个控制器，其中一个操作方法是删除一条记录。如果记录删除成功，我将使用正常的

警报（…）

弹出窗口通知用户记录已成功删除问题：有没有办法在下面的AJAX调用中使用引导对话框？如果有，如何使用

我在VS2015中使用的ASP.NET内核具有默认内置功能。没有AngularJS

$('#DeleteBtnID').click(function (e) {

    var PK_id = $(this).val();    
    $.ajax({
        url: '@Url.Action("TestAction", "TestContr")',
        data: { id: PK_id },
        contentType: 'application/json',
        dataType: 'html',
        type: 'GET',
        cache: false,
        success: function (data) {
            alert('Record Deleted Successfully');
        },
        error: function (jqXHR, textStatus) {
            alert(jqXHR.statusCode);
        }
    });

});

---

首先，您需要在当前页面（或布局文件）中保留模式对话框所需的标记

在这里，您只更新模态体的p标记内容。您可以更改此代码以更新模式对话框标题、隐藏/显示某些按钮等

您可以改进这一点，只需在页面中设置最小的标记，让您的操作方法返回本文中解释的模式内容标记

有一个很好的js库，名为，它使您的生活更轻松。基本上，bootbox负责为页面中的模式对话框构建标记。有了这个，你所要做的就是调用他们的方法

将引导盒库包括到页面中

<script src="https://cdnjs.cloudflare.com/ajax/libs/bootbox.js/4.4.0/bootbox.min.js"></script>

---

在您的第一个建议（不带引导框）中，我在Chrome开发工具的

Sources

选项卡中遇到了以下错误：

TypeError:$（…）。modal（）不是函数

。我还注意到，在VS2015中，编辑器的

Intellisense

没有识别

modal（）

中的

$（“#myModal”）.modal（）所以我硬编码了
.modal（）
部分。页面中是否包含引导库js文件？在调用任何方法之前，请检查视图源代码并确保正确包含/加载库。当我使用VS2015名为
ASP.NET Core Web应用程序（.NET Core）
的默认项目模板创建ASP.NET Core 1.1项目时，默认情况下包含引导。在同一页上，我正在使用另一个工作正常的删除确认模式/对话框。但是，当我单击此对话框的Delete按钮时，AJAX调用成功地删除了记录，并且当
success:function（data）{…}
AJAX调用的一部分使用您的
$（'#myModal'）.modal（）时发生错误函数。
var pkId = 33;
$.ajax({
    url: '@Url.Action("Delete", "Home")',
    data: { id: pkId },
    type: 'POST',
    success: function (data) {
        $("#modalMsg").text('deleted successfully');
        $('#myModal').modal();
    },
    error: function (jqXHR, textStatus) {
        // to do : handle error
    }
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/bootbox.js/4.4.0/bootbox.min.js"></script>

var pkId = 33;
$.ajax({
    url: '@Url.Action("Delete", "Home")',
    data: { id: pkId },
    type: 'POST',
    success: function (data) {
        bootbox.alert("This is the default alert!");
    },
    error: function (jqXHR, textStatus) {
        // to do : handle error
    }
});