javascript - 通过 JQuery 在 mvc-5 操作中执行删除

Question

我正在开发一个网站，用户可以在其中添加或删除有轨电车网络的预订流量。我已经通过删除按钮走到了这一步。

<input type="button" value="Delete" class="deleteTraffic btn btn-link NoBorder NoBackGround" data-id="@traffic.Id" />

jQuery(document).ready(function() {
    jQuery('.deleteTraffic').click(function() {
        var id = $(this).data('id');
        var url = '@Url.Action("DeleteTraffic", "TrafficDate", new { trafficId=id })';
        url = url.replace("id", id);
        $.post(url, function (data) {
            if (data) {
                $('#pnlEditTraffics').hide().fadeIn('fast');
            } else {
                alert("Error.");
            }
        });
    });
});

public ActionResult DeleteTraffic(int id)
{
    return Json(TrafficData.DeleteTraffic(id));
}

按钮工作正常并且参数传递正常，但 Controller 中的操作永远不会到达。 Controller 名为 TrafficDateController

Answer 1

第一个问题是向 Url.Action() 传递参数的顺序，操作名称是第一个参数，而第二个参数是 Controller 名称:

@Url.Action("DeleteTraffic", "TrafficDate")

此外，由于 DeleteTraffic 操作是使用 POST 动词调用的，因此您最好将 id 作为请求正文的一部分传递因此无需使用 url.replace('id', id) 手动构建最终路径:

var url = '@Url.Action("DeleteTraffic", "TrafficDate")',
    data = { id: id };

$.post(url, data, function (data) {
     // ...
});

参见MSDN