从枚举列表中搜索结果

Question

我有如下的枚举列表，我试图让它像下面的w3schools示例那样可搜索，因为它将有大约60 items.so，下拉列表将基于搜索。

public enum LocationType
{
    Brazil = 1,
    Arentina = 2,
    Canada = 3,
    USA = 4
    etc // here i will add around another 60 items
}

我的观点

    <div class="form-group">
        <label asp-for="Location" class="control-label"></label>
        <select asp-for="Location" class="form-control" asp-items="@Html.GetEnumSelectList<LocationType>()"></select>
        <span asp-validation-for="Location" class="text-danger"></span>
    </div>

W3schools示例https://www.w3schools.com/howto/howto_js_filter_lists.asp

Answer 1

下面是在剃须刀中使用Select2的演示：

<select id="locationSelect" asp-for="Location" class="form-control" asp-items="@Html.GetEnumSelectList<LocationType>()" > 
</select>

@section Scripts{
    <script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.12/js/select2.full.min.js"></script>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.12/css/select2.min.css"/>
    <script>
        $(document).ready(function () {
            $("#locationSelect").select2();
        });
    </script>
}

结果：

​

​

Answer 2

MVC没有现成的可搜索下拉列表。

您必须使用某种自定义实现。

您可以使用类似下面的内容：Autocomplete dropdown in MVC5?

另一种解决方案是创建一个用于搜索和提交值的文本框，在枚举值中使用linq，并将新的可枚举值与过滤后的值绑定。如果你不想要一篇完整的文章，你需要用javascript做一个ajax调用

Answer 3

你可以使用像'select2‘这样的jquery插件来进行搜索。您可以使用下面的代码来获取Enum项。

var items = Enum.GetNames(typeof(LocationType));