ASP.NET MVC项目中C# Delete按钮点击无响应问题求助

问题核心 #

你当前的Delete按钮只是静态HTML按钮，没有绑定任何触发删除操作的逻辑（比如AJAX请求或表单提交），因此点击后没有反应。

解决方案 #

1. 确保后端存在Delete Action

在MedicinesController中添加处理删除的Post请求方法：

[HttpPost]
[Authorize(Roles = "Administrator")]
[ValidateAntiForgeryToken] // 可选但建议添加，防止CSRF攻击
public ActionResult Delete(int id)
{
    // 示例删除逻辑，根据你的数据上下文调整
    using (var db = new YourDbContext())
    {
        var medicine = db.Medicines.Find(id);
        if (medicine != null)
        {
            db.Medicines.Remove(medicine);
            db.SaveChanges();
        }
    }
    return RedirectToAction("Index"); // 删除后返回列表页
}

2. 前端绑定删除逻辑（二选一）

方式一：AJAX无刷新删除

保留现有按钮，添加jQuery脚本处理点击事件：
在页面底部添加脚本块：

@section Scripts {
    <script>
        $(function() {
            $('.js-delete').on('click', function() {
                const $btn = $(this);
                if (confirm('确定要删除该记录吗？')) {
                    $.ajax({
                        url: `/Medicines/Delete/${$btn.data('id')}`,
                        type: 'POST',
                        headers: {
                            'RequestVerificationToken': $('input[name="__RequestVerificationToken"]').val()
                        }, // 如果后端加了ValidateAntiForgeryToken，需要传递这个令牌
                        success: function() {
                            $btn.closest('tr').fadeOut(500, function() {
                                $(this).remove();
                            });
                        },
                        error: function() {
                            alert('删除失败，请重试');
                        }
                    });
                }
            });
        });
    </script>
}

注意：页面中需要已加载jQuery（ASP.NET MVC默认布局通常包含，若没有需手动引入）。

方式二：表单提交删除

将Delete按钮包裹在表单中，点击时直接提交表单：
替换原按钮代码为：

@using (Html.BeginForm("Delete", "Medicines", new { id = item.Id }, FormMethod.Post))
{
    @Html.AntiForgeryToken()
    <button type="submit" class="btn btn-warning js-delete">Delete</button>
}

添加确认提示脚本：

@section Scripts {
    <script>
        $(function() {
            $('.js-delete').on('click', function(e) {
                if (!confirm('确定要删除该记录吗？')) {
                    e.preventDefault(); // 取消表单提交
                }
            });
        });
    </script>
}

额外检查项 #

• 确认当前登录用户属于Administrator角色，否则按钮不会渲染
• 验证路由是否正确：确保控制器名称是Medicines，Action名称是Delete，参数id能正确传递
• 若使用AJAX方式，需确保__RequestVerificationToken存在于页面中（通常布局页的表单或Html.AntiForgeryToken()会生成）

内容的提问来源于stack exchange，提问作者David