构建ASP.NET，试图从下拉列表中创建一个筛选器

Question

这里的第一个帖子，所以请温柔：(

我正在创建一个ASP。NET的MVC web应用程序，显示同类项目的列表(笔记本电脑(我想在每个标题下面的主视图中创建一个下拉列表，允许我在更改时过滤结果-因此选择为空，但用户可以单击并选择下拉列表中的值，主视图项目列表将根据选择立即更新。

列表现在是这样的：列表快照

我想实现一个下拉列表，但我似乎无法从下拉列表中获得选定的值：(DropDownlist填充正确，正在工作(

<select class="form-control" asp-items="Html.GetEnumSelectList<purpose>()"
onchange="@{Model = Model.Where(m=>m.Purpose == /*HERE SHOULD BE THE VALUE SELECTED*/)}">
<option selected="selected" value="">-Select one-</option>
</select>

然后刷新页面。。。但是-如何从选择中获取所选值？

如果是JavaScript，我会这么做：

html.document.getElementById("The id of the selection").value

但我不想要JavaScript，因为这都是ASP。净

需要明确的是，我有5个不同的下拉列表可供筛选，它们可以选择也可以不选择。

Answer 1

您混淆了客户端代码和服务器端代码。下面的示例仅使用MVC和完整的客户端-服务器体系结构。每个请求都需要往返于服务器。

在这个场景中有3个组件。

产品ViewModel.cs

public class ProductsViewModel
{
public IList<Laptop> Laptops { get; set; }
public PurposeEnum Purpose { get; set; }
}

产品控制器.cs

public class ProductsController : Controller
{
[HttpGet]
public IActionResult Index()
{
// Retrieve all records without a filter
var unfiltered = db.Laptops.ToList();
var viewModel = new ProductsViewModel() { AvailableLaptops = unfiltered };
return View(viewModel);
}
[HttpPost]
public IActionResult Index(ProductsViewModel viewModel)
{
// Use viewModel.Purpose & viewModel.Maker to filter records from database
var filtered = db.Laptops.Where(l => l.Purpose == viewModel.Purpose).ToList();
var filteredViewModel = new ProductsViewModel()
{
AvailableLaptops = filtered,
Purpose = viewModel.Purpose
};
return filteredViewModel;
}
}

产品\索引.cshtml

@model MyNameSpace.ViewModel
using (BeginForm())
{
@Html.DropDownList(Html.GetEnumSelectList<PurposeEnum>())
foreach (var l in Model.AvailableLaptops)
{
// Loop through Model.AvailableLaptops and generate table
}
<input type="submit" value="Search" />
}

当您第一次访问URL/Products/Index时，将触发GET操作处理程序。它将生成一个未筛选的产品列表，以及筛选所需的下拉列表。

当您进行选择并提交表单时，POST操作处理程序将被触发，并使用视图模型的Purpose和Maker属性中的选定值来过滤记录。会生成相同的视图，但其中包含筛选后的产品列表。

这是忽略验证、错误处理和安全性的非常基本的代码。