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

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>

请帮我!泰

Answer 1

您没有Id在AJAX方法中包含帖子.

没有它,它不会将Id发布到DeleteConfirmedaction方法:

$(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>