ASP.NET MVC：列表按钮ID传单个模态框再到Controller的实现问题

咱们先一步步拆解你的问题，先搞定ID传不到Controller的核心问题，再优化模态框的复用方案～

1. 修复ID传递失败的问题 #

你当前的deleteConfirm函数里$.post的语法写错了！括号位置不对，导致参数根本没传到后端，而且也没处理请求成功后的页面跳转。把函数改成这样：

function deleteConfirm() {
    $.post(url, { Id: myLinkId }, function() {
        // 请求成功后自动跳回Index页面
        window.location.href = '@Url.Action("Index", "Control")';
    }).fail(function() {
        // 可选：给用户提示删除失败的情况
        alert("删除失败，请稍后重试");
    });
}

之前的错误写法是$.post(url), { Id: myLinkId };，把参数写在了AJAX请求的括号外面，导致后端完全接收不到Id参数。修正后参数会正确传递，请求成功后也会自动跳转回列表页。

2. 优雅复用单个模态框（告别全局变量/多模态框） #

其实不用单独声明全局变量，咱们可以把需要的Id和请求URL直接存在模态框元素的data属性里，既干净又不会有全局变量污染的问题。

第一步：修改删除按钮的点击事件 #

$(document).on("click", ".delete-Link", function () {
    var linkId = $(this).data('id');
    var requestUrl = $(this).data('request-url');
    // 把数据存到模态框的data属性中
    $("#deleteLink").data({
        linkId: linkId,
        requestUrl: requestUrl
    });
});

第二步：修改模态框的确认按钮逻辑 #

先把模态框里的确认按钮加上ID：

<button type="button" class="btn btn-primary" id="confirmDeleteBtn">Yes</button>

然后绑定点击事件，直接从模态框的data里取数据：

$(document).on("click", "#confirmDeleteBtn", function() {
    var modal = $("#deleteLink");
    var targetId = modal.data('linkId');
    var targetUrl = modal.data('requestUrl');
    
    $.post(targetUrl, { Id: targetId }, function() {
        window.location.href = '@Url.Action("Index", "Control")';
        modal.modal('hide'); // 成功后隐藏模态框
    }).fail(function() {
        alert("删除失败，请稍后重试");
        modal.modal('hide');
    });
});

这样不管列表有多少条数据，只需要一个模态框就够了。点击不同的删除按钮时，对应的Id和URL会被临时存在模态框里，确认删除时再取出来用，完全不用全局变量，代码更优雅。

小补充：Controller端规范 #

记得给你的Delete方法加上[HttpPost]特性，因为咱们用的是POST请求，这样能避免GET请求误触发删除操作：

[HttpPost]
public ActionResult Delete(int Id) { 
    UserLinks links = new UserLinks(); 
    links.delete(Id, User.Identity.Name); 
    return RedirectToAction("Index"); 
}

内容的提问来源于stack exchange，提问作者Tolga Açış