Question

我在我的一个项目中使用Webgrid，所有功能（添加，编辑，删除，详细信息）都正常工作。我使用ajax post方法删除同一表单上的记录。

因此，当我单击Delete时，它会从数据库中删除记录。但是，当我第一次点击类别名称时，要显示该类别的详细信息，之后我点击删除它不会做任何事情。

删除链接的Click事件不起作用。我不知道为什么会这样。

以下是我的观点：

@model IEnumerable<Demo.Models.CategoryModel>
@{
ViewBag.Title = "Category List";
}
@{
Demo.Models.CategoryModel category = new Demo.Models.CategoryModel();
}
@{

var gd = new WebGrid(Model, canPage: true, rowsPerPage: 5, selectionFieldName: "selectedRow", ajaxUpdateContainerId: "gridContent");

}
<div class="main">
<h2>
    Category List</h2>
<p>
    @Html.ActionLink("Create New", "Create")
</p>
<div id="gridContent">
    @using (Html.BeginForm("Delete", null, FormMethod.Post, new { @class = "updateForm" }))
    {
        @gd.GetHtml(tableStyle: "tbl",

                 headerStyle: "",

            alternatingRowStyle: "altRow",

            selectedRowStyle: "selectRow",

            mode: WebGridPagerModes.All,

            columns: gd.Columns(

            gd.Column("Category Name", format: (item) => item.GetSelectLink(item.Name)),

            gd.Column("Description", "Description"),

            gd.Column("ParentCategoryName", "Parent Category"),

            gd.Column("", header: "", format: @<text>
        @Html.ActionLink("Edit", "Edit", new { id = item.CategoryId }, new { @class = "edit" })
        | <a href="JavaScript:void(0)" class="RemoveLink" data-id="@item.CategoryId" onclick = "return confirm('Do you want to Delete this Category?')">
            Delete</a>
        </text>, style: "last-item"
                     )
             ))

        <div class="cat-dets">
            @if (gd.HasSelection)
            {
                <h2>
                    Category Details</h2>
                category = (Demo.Models.CategoryModel)gd.Rows[gd.SelectedIndex].Value;
                <b>Category Id: </b> @category.CategoryId<br />  
                <b>Category Name: </b> @category.Name<br />            
                <b>Description</b> @category.Description<br />
                <b>Parent Category</b> @category.ParentCategoryName<br />
            }
        </div>
    }
</div>
</div>
<script type="text/javascript">
$(document).ready(function () {        
    $(".RemoveLink").click(function () {            
        var recordToDelete = $(this).attr("data-id");            
        if (recordToDelete != '') {
            $.post("/Category/Delete", { "id": recordToDelete },
            function (data) {
                if (data.status == "success") {
                    window.location.href = window.location.href;
                }
            });
        }
    });
});
</script>

如果我遗漏了东西，请帮帮我..

由于

更新

经过一些谷歌搜索后，我发现这可能是webgrid Get Method发布和我的表单的Post Method数据发布之间的问题。由于删除在分页和排序后也无法正常工作。如果有人使用 Form Post方法和webgrid 那么请帮助我。

Answer 1

下午好，尝试使用jquery“on”绑定定义removelink click事件：

$(".RemoveLink").on("click", function () { 
    ...
});

在MVC 4中显示webgrid中的详细信息后，Form Post无法正常工作

1 个答案: