C# MVC 通过下拉列表过滤表

Question

我有一个视图，其中有一个显示值的表。我想添加一个过滤状态列结果的下拉列表。例如，如果我选择“Reviewing”，则只会出现“Reviewing”状态的记录。下面是我的看法。

@model IEnumerable<DRT.Models.Master>

@{
    ViewBag.Title = "Index";
}

<h2>Index</h2>

<p>
    @Html.ActionLink("Create New", "Create")
</p>
<table class="table">
<tr>
    <th>
        @Html.DisplayNameFor(model => model.RequestType.Name)
    </th>
    <th>
        @Html.DisplayNameFor(model => model.Reviewer.Name)
    </th>
    <th>
        @Html.DisplayNameFor(model => model.Status.Name)
    </th>
    <th>
        @Html.DisplayNameFor(model => model.ProjectName)
    </th>
    <th>
        @Html.DisplayNameFor(model => model.ProjectLocation)
    </th>
    <th>
        @Html.DisplayNameFor(model => model.Requestor)
    </th>
    <th>
        @Html.DisplayNameFor(model => model.DateReceived)
    </th>
    <th>
        @Html.DisplayNameFor(model => model.ReviewCompDate)
    </th>
    <th>
        @Html.DisplayNameFor(model => model.ProjectFolerLink)
    </th>
    <th>
        @Html.DisplayNameFor(model => model.ModellingReferralDate)
    </th>
    <th>
        @Html.DisplayNameFor(model => model.ModellingReviewCompletionDate)
    </th>
    <th>
        @Html.DisplayNameFor(model => model.SewerMaintenanceReferralDate)
    </th>
    <th>
        @Html.DisplayNameFor(model => model.SewerMaintenanceReviewCompletionDate)
    </th>
    <th>
        @Html.DisplayNameFor(model => model.FlowControlReferralDate)
    </th>
    <th></th>
</tr>

@foreach (var item in Model) {
<tr>
    <td>
        @Html.DisplayFor(modelItem => item.RequestType.Name)
    </td>
    <td>
        @Html.DisplayFor(modelItem => item.Reviewer.Name)
    </td>
    <td>
        @Html.DisplayFor(modelItem => item.Status.Name)
    </td>
    <td>
        @Html.DisplayFor(modelItem => item.ProjectName)
    </td>
    <td>
        @Html.DisplayFor(modelItem => item.ProjectLocation)
    </td>
    <td>
        @Html.DisplayFor(modelItem => item.Requestor)
    </td>
    <td>
        @Html.DisplayFor(modelItem => item.DateReceived)
    </td>
    <td>
        @Html.DisplayFor(modelItem => item.ReviewCompDate)
    </td>
    <td>
        @Html.DisplayFor(modelItem => item.ProjectFolerLink)
    </td>
    <td>
        @Html.DisplayFor(modelItem => item.ProjectComments)
    </td>
    <td>
        @Html.DisplayFor(modelItem => item.DischargeLocationID)
    </td>
    <td>
        @Html.DisplayFor(modelItem => item.DischargeDistrict)
    </td>
    <td>
        @Html.DisplayFor(modelItem => item.SystemType)
    </td>
    <td>
        @Html.DisplayFor(modelItem => item.AffectedRequlator)
    </td>
    <td>
        @Html.DisplayFor(modelItem => item.StartDateOfDischarge)
    </td>
    <td>
        @Html.DisplayFor(modelItem => item.DurationOfDischarge)
    </td>
    <td>
        @Html.DisplayFor(modelItem => item.RequestFlowRate)
    </td>
    <td>
        @Html.DisplayFor(modelItem => item.ApprovedDischargeRate)
    </td>
    <td>
        @Html.DisplayFor(modelItem => item.DischargeLocationComments)
    </td>
    <td>
        @Html.DisplayFor(modelItem => item.ModellingReferralDate)
    </td>
    <td>
        @Html.DisplayFor(modelItem => item.ModellingReviewCompletionDate)
    </td>
    <td>
        @Html.DisplayFor(modelItem => item.SewerMaintenanceReferralDate)
    </td>
    <td>
        @Html.DisplayFor(modelItem => item.SewerMaintenanceReviewCompletionDate)
    </td>
    <td>
        @Html.DisplayFor(modelItem => item.FlowControlReferralDate)
    </td>
    <td>
        @Html.ActionLink("Edit", "Edit", new { id=item.MasterId }) |
        @Html.ActionLink("Details", "Details", new { id=item.MasterId }) |
        @Html.ActionLink("Delete", "Delete", new { id=item.MasterId })
    </td>
</tr>
}

</table>

Answer 1

您的视图中基本上需要一个 SELECT 元素，当使用选择某些内容时，您可以将选定的值发布到操作方法，您将在从数据库获取数据时使用该值。

你可以创建一个新的视图模型

public class ListAndSearchVm
{
  public IEnumerable<DRT.Models.Master> Data { set;get;}
  public IEnumerable<SelectListItem> Statuses { set;get;}
  public string SelectedStatus { set;get;}
}

现在在您的 GET 操作中，您需要加载视图模型的 Statuses 属性和 Data 属性。有一个参数来接受从您的状态过滤器下拉列表中选择的选项值。根据这个参数的值得到过滤后的数据。

public ActionResult Index(string selectedStatus="")
{
  var vm= new ListAndSearchVm();

  //Hard coding 2 items for demo. You can read this from your db table
  vm.Statuses = new List<SelectListItem> {
     new SelectListITem { Value="Open", Text="Open"},
     new SelectListITem { Value="Closed", Text="Closed"},
  };

  var data= dbContext.Masters;
  if(!String.IsNullOrEmpty(selectedStatus))
  {
     data = data.Where(f=>f.Status.Name==selectedSatatus);
  }      
  vm.Data = data.ToList();
  return View(vm);
}

现在在你的视野中

@model ListAndSerchVm
@using(Html.BeginForm("Index","YourControllerName",FormMethod.Get))
{
  <label> Select a status</label>
  @Html.DropDownListFor(f=>f.SelectedStatus,Model.Statuses,"Select")
  <input type="submit" value="Filter" />
}
<table>
<tr>
    <th>Request type</th>
    <th>Reviewer</th>
    <th>Status</th>
</tr>
@foreach(var item in Model.Data)
{
  <tr>
       <td>@item.RequestType.Name)</td>
       <td>@item.Reviewer.Name</td>
       <td>@item.Status.Name</td>
  </tr>
}
</table>