使用Visual Studio 2012在MVC3中使用复选框删除webgrid中的行

Question

我是MVC3的新手。我已经编写了一个应用程序，在其中我显示数据到一个带有复选框的webgrid。我试图找出如何发送一个特定的行id控制器动作方法，当我点击一个复选框。

Answer 1

这完全取决于您想要做什么。通常，在视图中，我将添加data-rowid="###"这样的数据属性，然后使用jQuery捕获.click事件。然后在.click事件中，为data-rowid检索已单击的元素值，并调用.ajax将数据发送到控制器。

Answer 2

这是一个完整的示例，其中我有一个WebGrid，其最后一列包含一个使用Ajax在服务器上调用操作的"Remove"链接。Ajax请求完成后，将从表中删除相应的行。MvcHtmlString用于向列中注入一个span标记。它包含一个id值，该值随后用于标识要从表中删除的行。

<div id="ssGrid">
    @{
        var grid = new WebGrid(canPage: false, canSort: false);
        grid.Bind(
            source: Model,
            columnNames: new[] { "Location", "Number", "Protection", "Methodology" }
        );
    }
    @grid.GetHtml(
        tableStyle: "webGrid",
        headerStyle: "header",
        alternatingRowStyle: "alt",
        columns: grid.Columns(
            grid.Column("Location", "Location"),
            grid.Column("Number", "Number"),
            grid.Column("Protection", "Protection"),
            grid.Column("Methodology", "Methodology"),
            grid.Column(
                format: (item) => 
                    new MvcHtmlString(string.Format("<span id='ssGrid{0}'>{1}</span>",
                                          item.SecondarySystemId,
                                          @Ajax.RouteLink("Remove",
                                              "Detail", // route name
                                              new { action = "RemoveSecondarySystem", actionId = item.SecondarySystemId },
                                              new AjaxOptions { 
                                                  OnComplete = "removeRow('ssGrid" + item.SecondarySystemId + "')"
                                              }
                                          )
                                     )
                    )
            )
        )
    )
</div>
<script>
    function removeRow(rowId) {
        $("#" + rowId).closest("tr").remove();
    }
</script>