Question

我正在尝试使用Ajax删除表中的行，以便在我尝试删除表的一行时页面不会刷新。这是我的代码，但目前按Delete不会做任何事情：

控制器：

public ActionResult Delete(int? id)
        {
            if (id == null)
            {
                return new HttpStatusCodeResult(HttpStatusCode.BadRequest);
            }
            Main main = db.Mains.Find(id);
            if (main == null)
            {
                return HttpNotFound();
            }
            return View(main);
        }
[HttpPost, ActionName("Delete")]
        public ActionResult DeleteConfirmed(int id)
        {
            Main main = db.Mains.Find(id);
            db.Mains.Remove(main);
            db.SaveChanges();
            return RedirectToAction("Index");
        }

观点：

<script>
$(document).ready(function () {
    $("#Delete").on("click", function () {
        var parent = $(this).parent().parent();
        $.ajax({
            type: "post",
            url: "@Url.Action("Delete","Main")",
            ajaxasync: true,
            success: function () {
                alert("success");
            },
            error: function (data) {
                alert(data.x);
            }
        });
    });
});
</script>

要从表中删除的实际链接：

 <td>
      @Html.ActionLink("Edit", "Edit", new { id = item.ID }) |
      <a href="" id="Delete">Delete</a>
</td>

请帮帮我！ TY

Answer 1

您未在AJAX方法的帖子中包含Id。

没有它，它就不会将ID发布到DeleteConfirmed操作方法：

$(document).delegate('#Delete', 'click', function (e) {

    e.preventDefault();

    $.ajax({
            type: "post",
            url: "@Url.Action("Delete","Main")",
            ajaxasync: true,
            data: { id : $('input#idField').val() },
            success: function () {

                alert("success");

                // Perform redirect
                window.location.replace("@Url.Action('Index', 'Main')");
            },
            error: function (data) {
                alert(data.x);
            }
        });
});

至于你发帖后没有重定向，那是因为你正在使用AJAX请求发出请求。如果您从操作方法返回重定向，则不会被您的网页尊重，因为它是服务器端重定向。

您必须检查成功消息，然后重定向成功。我建议如下：

[HttpPost, ActionName("Delete")]
public ActionResult DeleteConfirmed(int id)
{
    Main main = db.Mains.Find(id);
    db.Mains.Remove(main);
    db.SaveChanges();
    return new HttpStatusCodeResult(System.Net.HttpStatusCode.OK);
}

并将其添加到您的success（也在上面显示）：

// Perform redirect
window.location.replace(@Url.Action('Index', 'Main'));

您的页面正在重新加载页面，因为您的链接指示它：

<a href="" id="Delete">Delete</a> // Navigate to current page

在其中添加标记哈希，或在委托函数中添加e.preventDefault()或两者都添加（也在上面显示）：

<a href="#" id="Delete">Delete</a>

Answer 2

如果你改变：

return View(main);

到

return true;

将在AJAX电话会议上取得成功。

然后在浏览器中调整JS以检查是否

alert("success");

成功称为

Answer 3

您必须将Id传递给MVC Action。您实际上并未使用data jQuery方法的ajax选项将其作为参数传递。尝试调试MVC Action并查看您在Id参数中收到的内容。

 <script>
$(document).ready(function () {
$("#Delete").on("click", function () {
    var parent = $(this).parent().parent();
    var myId = //Get here you id
    $.ajax({
        type: "post",
        url: "@Url.Action("Delete","Main")",
        data: {id:  myId },
        ajaxasync: true,
        success: function () {
            alert("success");
        },
        error: function (data) {
            alert(data.x);
        }
    });
});
});

您可能还需要传递RequestVerificationToken

ASP.NET MVC 5使用AJAX删除数据库中的Row

3 个答案: