Question

我正在为我的学院创建一个项目。使用Asp.net MVC，我需要多个删除选项和选中的复选框。

我在我的视图中添加了一个检查，但没有删除多个Raw。我不想使用第三方插件。请帮帮我。

<table class="table table-striped table-condensed table-bordered">
    <tr>
        <th>
            Select
        </th>
        <th>
            @Html.ActionLink("Book Id", "Index", new { sortOrder = ViewBag.IdSortParm, currentFilter = ViewBag.CurrentFilter })
        </th>
        <th>
            @Html.ActionLink("Title", "Index", new { sortOrder = ViewBag.NameSortParm, currentFilter = ViewBag.CurrentFilter })
        </th>
        <th>
            @Html.ActionLink("Date", "Index", new { sortOrder = ViewBag.DateSortParm, currentFilter = ViewBag.CurrentFilter })
        </th>
        <th>
            Price
        </th>
        <th>
            Category
        </th>
        <th class="text-center">
            Photo
        </th>
        <th>
            User
        </th>
        <th>Edit</th>
        <th>Delete</th>
    </tr>

    @foreach (var item in Model)
    {
        <tr>
            <td>
                <input type="checkbox" name="deleteInputs" value="@item.BookId" />
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.BookId)
            </td>
            <td>
                @Html.ActionLink(item.BookTitle, "Details", new
                {
                    id = item.BookId
                })
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.PublishDate)
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.Price)
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.Category)
            </td>
            <td class="text-center">
                <img class="img-thumbnail" width="50" height="50" src="~/ContentImages/Full/@item.Photo" />
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.UserName)
            </td>
            <td>
                @Html.ActionLink("Edit", "Edit", new { id = item.BookId })
            </td>
            <td>
                @Html.ActionLink("Delete", "Delete", new { id = item.BookId })
            </td>
        </tr>
    }
</table>

Answer 1

这可能是实现它的一种方式：

首先将表嵌入到命名表单中，该表单执行批量删除操作，如下所示：

@{ Html.BeginForm("BatchDelete", "Book", FormMethod.Post, new { name = "tableForm" }); }
  <table class="table table-striped table-condensed table-bordered">
    <tr>
      <th>
        Select
      </th>
      <th>
        @Html.ActionLink("Book Id", "Index", new { sortOrder = ViewBag.IdSortParm, currentFilter = ViewBag.CurrentFilter })
      </th>
      <th>
        @Html.ActionLink("Title", "Index", new { sortOrder = ViewBag.NameSortParm, currentFilter = ViewBag.CurrentFilter })
      </th>
      <th>
        @Html.ActionLink("Date", "Index", new { sortOrder = ViewBag.DateSortParm, currentFilter = ViewBag.CurrentFilter })
      </th>
      <th>
        Price
      </th>
      <th>
        Category
      </th>
      <th class="text-center">
        Photo
      </th>
      <th>
        User
      </th>
      <th>Edit</th>
      <th>Delete</th>
    </tr>

    @foreach (var item in Model)
    {
      <tr>
        <td>
          <input type="checkbox" name="deleteInputs" value="@item.BookId" />
        </td>
        <td>
          @Html.DisplayFor(modelItem => item.BookId)
        </td>
        <td>
          @Html.ActionLink(item.BookTitle, "Details", new
          {
            id = item.BookId
          })
        </td>
        <td>
          @Html.DisplayFor(modelItem => item.PublishDate)
        </td>
        <td>
          @Html.DisplayFor(modelItem => item.Price)
        </td>
        <td>
          @Html.DisplayFor(modelItem => item.Category)
        </td>
        <td class="text-center">
          <img class="img-thumbnail" width="50" height="50" src="~/ContentImages/Full/@item.Photo" />
        </td>
        <td>
          @Html.DisplayFor(modelItem => item.UserName)
        </td>
        <td>
          @Html.ActionLink("Edit", "Edit", new { id = item.BookId })
        </td>
        <td>
          @Html.ActionLink("Delete", "Delete", new { id = item.BookId })
        </td>
      </tr>
    }
  </table>

  <!-- Section for buttons -->
  <div class="actions">
      <a href="javascript:(function(){document.tableForm.submit();return void(0);})()">
        Delete selected books
      </a>
  </div>
@{ Html.EndForm(); }

请注意，在表格之后，在结束表单之前，我添加了一个执行表单提交的链接。

现在，在控制器端，其名称为“BookController”：

public class BookController : Controller
{
    // ...

    [HttpPost]
    public ActionResult BatchDelete(int[] deleteInputs)
    {
        // You have your books IDs on the deleteInputs array
        if (deleteInputs != null && deleteInputs.Length > 0)
        {
            // If there is any book to delete
            // Perform your delete in the database or datasource HERE
        }
        // And finally, redirect to the action that lists the books
        // (let's assume it's Index)
        return RedirectToAction("Index");
    }

    // ...
}

请注意：

Html.BeginForm方法的前两个参数是操作名称和控制器名称（不带“Controller”后缀）。
同一方法的最后一个参数包括表单的名称。该名称用于链接的javascript中，以指示您要提交的表单。

Answer 2

首先，每个复选框都需要不同的Id，以便您知道要删除哪条记录。其次，如果您将“删除”实施为链接，则浏览器将执行GET操作而不是POST。假设您没有使用AJAX，那么您将需要一个表单，以便POST能够处理删除的控制器操作。

如何使用Checkbox删除多个记录？

2 个答案: