C# 如何筛选asp.netcore项目上的列表

我很抱歉事先可能会解释得不好（我刚开始编程，所以我对这些短语和所有内容还是新手）

我有一个asp.netcore应用程序，其中显示了公司中所有代理的列表，该列表是使用controller从DB获取的：

ViewData["Agents"] = new SelectList(_context.Agent.OrderBy(x => x.FullName), "Id", "FullName");

然后在视图中显示数据：

 <div class="col-md-10">
     <select asp-for="AgentId"  class ="form-control"  asp-items="ViewBag.Agents"  ></select>
 </div>

这段代码工作正常，但我希望允许用户过滤代理名称，这样他们就不必搜索整个列表。我试图在互联网上寻找一种方法，但可以找到任何方法（可能我没有使用正确的搜索词）

谢谢

编辑：

<h2>חדש</h2>
<form asp-action="Create">
    <div class="form-horizontal">
        <h4>HI</h4>
        <hr />
        <div asp-validation-summary="ModelOnly" class="text-danger"></div>
        <label asp-for="AgentId" class="col-md-2 control-label">סוכן</label>
        <div class="col-md-10">
            <select asp-for="AgentId" id="selectAgent" class="form-control" asp-items="ViewBag.Agents"></select>
        </div>
    </div>
    <div class="form-group">
        <div class="col-md-offset-2 col-md-10">
            <input type="submit" value="Submit" class="btn btn-default" />
        </div>
    </div>
</form>

@section Scripts {
@{await Html.RenderPartialAsync("_ValidationScriptsPartial");}
<link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/css/select2.min.css" rel="stylesheet" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/js/select2.min.js"></script>

    <script>

        var rawModel = @Html.Raw(Json.Encode(ViewData["Agents"]));

        var data = $.map(rawModel, function (obj) {

            obj.id = obj.id || obj.Value; // replace Value with your identifier (in your case that would be Id)

            obj.text = obj.text || obj.Text; // replace name with the property used for the Text (in your case that would be FullName)
            return obj;
        });

        $('#selectAgent').select2({ data:data});

    </script>
}

我的代理类（动作部分）：

公共类AgentAggrementChangeRequestsController:控制器
{
私有只读SabreContext_上下文；
.......
//获取：AgentAgrementChangeRequests
公共异步任务索引（字符串搜索字符串）
{
var sabreContext=\u context.AgentAggrementChangeRequest.Include（a=>a.Agent）；
ViewData[“Agents”]=新的选择列表（_context.Agent.OrderBy（x=>x.FullName），“Id”，“FullName”）；
返回视图（等待sabreContext.toListSync（））；
}
.....

以及以下观点：

<h2>חדש</h2>
<form asp-action="Create">
    <div class="form-horizontal" >
        <h4>תנאי הסכם סוכן חדש</h4>
        <hr />
        <div asp-validation-summary="ModelOnly" class="text-danger"></div>
            <label asp-for="AgentId" class="col-md-2 control-label">סוכן</label>
            <div class="col-md-10">
                <select asp-for="AgentId"  class ="form-control"  asp-items="ViewBag.Agents"  ></select>
            </div>
        </div>
        <div class="form-group">
            <div class="col-md-offset-2 col-md-10">
                <input type="submit" value="צור חדש" class="btn btn-default" />
            </div>
        </div>
    </div>
</form>

@section Scripts {
    @{await Html.RenderPartialAsync("_ValidationScriptsPartial");}
}

תנאי הסכם סוכן חדש

סוכן
@节脚本{
@{wait Html.RenderPartialAsync（“_validationScript”）；}
}

我认为这应该使用Ajax结合某种JQuery控件或其他方法来完成

另一个解决方案是在内存（客户端）中进行过滤。这也可以使用这些解决方案来完成

但是如果您想过滤服务器端，您需要向ajax调用传递一个查询/术语并进行类似的过滤

_context.Agent.Where(x=>x.FullName.ToLower().Contains(term.ToLower()).OrderBy(x => x.FullName)

看 或者同意乔迪的观点

您可以使用ajax获取代理列表，或者在视图模型中返回该列表，并使用select2或类似插件以获得更好的使用体验

你的行动方法：

public ActionResult ReturnPage(){

  using(var _context = new YourDbObject())
  {
     var listOfAgents = _context.Agents.OrderBy(x => x.FullName).ToList();
  }

  return View(listOfAgents);
}

在你看来：

<div class="col-md-10">
  <select class ="form-control" id="selectAgent"></select>
</div>

在视图末尾添加javascript代码：

<script>
   $('#selectAgent').select2({
     data: @Html.Raw(Json.Encode(@Model))
   });
</script>

$（“#selectAgent”）。选择2({
数据：@Html.Raw（Json.Encode（@Model））
});

为了得到工作，你需要做几件事：

在视图或布局中包含JS和CSS文件

确保您返回的内容符合select2或select2所要求的格式 只需按你的方式绘制地图

如果您的模型使用的格式不是必需的格式，请选择2

编辑：添加新代码：我已尝试模拟您的情况。

在您看来：

<h2>חדש</h2>
<form asp-action="Create">
    <div class="form-horizontal">
        <h4>HI</h4>
        <hr />
        <div asp-validation-summary="ModelOnly" class="text-danger"></div>
        <label asp-for="AgentId" class="col-md-2 control-label">סוכן</label>
        <div class="col-md-10">
            <select asp-for="AgentId" id="selectAgent" class="form-control" asp-items="ViewBag.Agents"></select>
        </div>
    </div>
    <div class="form-group">
        <div class="col-md-offset-2 col-md-10">
            <input type="submit" value="Submit" class="btn btn-default" />
        </div>
    </div>
</form>

@section Scripts {
@{await Html.RenderPartialAsync("_ValidationScriptsPartial");}
<link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/css/select2.min.css" rel="stylesheet" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/js/select2.min.js"></script>

    <script>

        var rawModel = @Html.Raw(Json.Encode(ViewData["Agents"]));

        var data = $.map(rawModel, function (obj) {

            obj.id = obj.id || obj.Value; // replace Value with your identifier (in your case that would be Id)

            obj.text = obj.text || obj.Text; // replace name with the property used for the Text (in your case that would be FullName)
            return obj;
        });

        $('#selectAgent').select2({ data:data});

    </script>
}

你好

סוכן
@节脚本{
@{wait Html.RenderPartialAsync（“_validationScript”）；}
var rawModel=@Html.Raw（Json.Encode（ViewData[“Agents”]）；
变量数据=$.map（rawModel，函数（obj）{
obj.id=obj.id | | obj.Value；//用您的标识符替换值（在您的情况下是id）
obj.text=obj.text | | obj.text；//将name替换为用于文本的属性（在您的情况下为全名）
返回obj；
});
$（'#selectAgent'）。select2（{data:data}）；
}

这就是它的样子：

如果搜索：

---

嘿，谢谢你的回答。我因为没有定义Json.Endoe而收到一个错误。我需要某个扩展吗？另一件事，很抱歉我不知道-我应该把JS代码放在哪里？“在视图的末尾”，在标签内？或在allOk wait后的末尾。我将在半小时内更新帖子，并提供更多详细步骤。可以编辑您的帖子，添加以下：Agents类和操作方法框架，以便我了解是否有什么需要注意的。非常感谢。我仍然在

@Html.Raw下获得下划线（Json.**Encode**（ViewData[“Agents”]）；

“IJsonHelper不包含编码和无扩展的定义…”请参考此答案，看看它是否适用于您。我在“引用”（在我的vb中称为依赖项）下找不到任何内容，当我添加参考时，窗口打开，里面什么也没有..嗨，sagi，让我知道它现在是否适合你？