Question

我想用输入字段做下拉列表。我使用Blazor客户端框架。

这是我的代码

       <div>
            <datalist id="suggestions">
                @if (cityList != null)
                {
                    @foreach (var city in cityList)
                    {
                        <option value="@city.CityName">@city.CityName</option>
                    }
                }
            </datalist>
          <input autoComplete="on" list="suggestions" />
        </div>

这是可行的，但是如果我尝试在输入中打印不存在的值-结果就可以了。我需要阻止选择不存在的元素。我该如何使用数据列表？还是我需要使用选择选项？预先感谢！

Answer 1

如果要阻止选择不存在的元素，请使用InputSelect组件。

如果要创建一种搜索机制，以显示建议列表以选择（以自动完成形式）进行搜索，但又允许用户输入其他值进行搜索，请使用带有输入标签的数据列表。毕竟这是搜索工具的工作方式，对吗？我知道将数据列表与输入标签一起使用很诱人，因为它对眼睛更具吸引力。但是，只有在它符合所需功能时，才应使用它。

话虽如此，我相信您可以使用datalist和input标签创建一个组件，该组件可以阻止选择不存在的元素。这可能涉及Blazor数据绑定，C＃代码以及JSInterop。除非...

，否则我不会尝试这样做。

希望这对您有帮助...

如何使用blazor对带有输入字段的下拉列表进行过滤？

1 个答案: