asp.net-mvc - 在检查复选框时删除表格行

Question

我有包含数据的表。在每一行中都有一个复选框和一个复选框，用于选择标题处的所有复选框。
选中此复选框后，将从数据库表中删除相应的行。另外，在选中标题处的复选框时，将从数据库表中删除所有行。我如何实现此 asp.net mvc。

Answer 1

一如既往地从模型开始:

public class ProductViewModel
{
    public int Id { get; set; }
    public string Name { get; set; }
}

然后是一个 Controller :

public class HomeController : Controller
{
    // TODO: Fetch this from a repository
    private static List<ProductViewModel> _products = new List<ProductViewModel>
    {
        new ProductViewModel { Id = 1, Name = "Product 1" },
        new ProductViewModel { Id = 2, Name = "Product 2" },
        new ProductViewModel { Id = 3, Name = "Product 3" },
        new ProductViewModel { Id = 4, Name = "Product 4" },
        new ProductViewModel { Id = 5, Name = "Product 5" },
    };

    public ActionResult Index()
    {
        return View(_products);
    }

    [HttpPost]
    public ActionResult Delete(IEnumerable<int> productIdsToDelete)
    {
        // TODO: Perform the delete from a repository
        _products.RemoveAll(p => productIdsToDelete.Contains(p.Id));
        return RedirectToAction("index");
    }
}

最后是 Index.aspx看法:

<% using (Html.BeginForm("delete", "home", FormMethod.Post)) { %>

    <table>
        <thead>
            <tr>
                <th>Name</th>
                <th>Select</th>
            </tr>
        </thead>
        <tbody>
            <%= Html.EditorForModel()%>
        </tbody>
    </table>

    <input type="submit" value="Delete selected products" />

<% } %>

以及产品编辑器模板( ~/Views/Home/EditorTemplates/ProductViewModel.ascx ):

<%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl<ToDD.Controllers.ProductViewModel>" %>
<tr>
    <td>
        <%: Model.Name %>
    </td>
    <td>
        <input type="checkbox" name="productIdsToDelete" value="<%: Model.Id %>" />
    </td>
</tr>