从下拉菜单中获取模型

环境

问题

当我从下拉列表(如下拉列表，组合框，自动完成，多选)中选择一个项目时，我想获得我的模型的一个实例。我只能得到一个基本类型价值和ValueField．

描述

下拉菜单提供了一个原语价值这验证可以工作，这样其他数据源操作(如筛选)也可以工作。Value和Text不能是类(模型)，因为这会阻止验证的工作，并且过滤/比较整个类是一个没有定义的操作。

解决方案

您可以采用两种方法—继续使用Telerik组件及其功能，并使用一些Data操作来检索所需的数据，或者构建您自己的组件以提供所需的功能:

• Telerik组件
• 自定义下拉组件

Telerik组件

解决方案是使用从组件获得的惟一标识符价值)，并从其数据源数据集合)来过滤它(例如，通过使用在()操作符)。

下面的例子展示了为下拉列表、组合框和自动完成组件执行此操作的一种方法。对于MultiSelect，您必须遍历所选值集合，对于AutoComplete，您可能希望确保唯一的文本值(AutoComplete是带有建议的自由文本输入，而不是带有强制选择的下拉列表)。

值:@DdlValue 
@result 
   
   @code {string result;int DdlValue {get;设置;} = 5;void GetSelectedItem() {GetItemFromModelData();} void ValueChangedHandler(int v) {DdlValue = v;GetItemFromModelData ();} void GetItemFromModelData(){//从数据源中提取数据项，使用MyDdlModel selectedItem = myDdlData。Where(d => d.MyValueField == DdlValue).FirstOrDefault();if (selectedItem != null) //例如，组合中的自定义文本，或者没有匹配自动补全{result = selectedItem. mytextfield; } else { result = "no item selected"; } } public class MyDdlModel { public int MyValueField { get; set; } public string MyTextField { get; set; } } IEnumerable myDdlData = Enumerable.Range(1, 20).Select(x => new MyDdlModel { MyTextField = "item " + x, MyValueField = x }); }

@selectedValue 
   @if (selectedItem != null) {
来自模型的数据:
文本字段:@selectedItem。MyTextField 
唯一标识符:@selectedItem。MyValueField 
 
} @code {void OnChangeHandler(对象值){int userInput = (int)值;MyDdlModel item = myDdlData。FirstOrDefault(x => x.MyValueField == userInput);if (item != null) {selectedItem = item;} else {selectedItem = null;}}公共类MyDdlModel{公共int MyValueField{获取;设置;}公共字符串MyTextField{获取;设置; } } IEnumerable myDdlData = Enumerable.Range(1, 20).Select(x => new MyDdlModel { MyTextField = "item " + x, MyValueField = x }); MyDdlModel selectedItem { get; set; } int selectedValue { get; set; } = 4; }

@ thevalue 
   @if (selectedItem != null) {
来自模型的数据:
建议:@selectedItem。建议
唯一标识:@selectedItem。UniqueIdentifier 
 
} @code{string值{get;设置;} public suggested smodel selectedItem {get;设置;} void OnChangedHandler(object input){//从数据集合中提取数据模型。FirstOrDefault(x => x. suggestion ==(字符串)input);selectedItem = matchingItem;//注意:matchingItem可能是空的，因为AutoComplete是一个自由文本输入//用户可以写一些他们自己的东西，不是在数据源}List<建议模型>建议{获取;设置;} = new List< advistionsmodel > {new advistionsmodel {Suggestion = "first"}， new advistionsmodel {Suggestion = "second"}， new advices model {Suggestion = "third"}}; public class SuggestionsModel { public string Suggestion { get; set; } public Guid UniqueIdentifier { get; set; } = Guid.NewGuid(); } }

的方法中应用相同的方法ValueChanged或者在OnChange事件。如果你使用ValueChanged，确保也更新视图模型与新的价值因为框架不允许双向绑定。这两个事件的不同之处在于他们什么时候开火OnChange更适合异步如有需要，请进行操作。

自定义下拉组件

您可以使用自己的代码模拟Telerik组件的外观和行为，以便只公开选定的项。

下面的示例复制了Telerik DropDownList呈现，并使用网格提供整个项目选择。您可以更进一步，使其成为通用的，并根据需要公开数据和值字段的参数，而不是像这个示例中那样对数据和字段名进行硬编码。

@*这个例子展示了如何创建一个自定义的下拉列表，使用Grid来处理选择并返回整个模型*@ @if (SelectedEmployee != null) {
所选项目:@SelectedEmployee。来自团队@ selecteemployee的EmployeeId。团队有一个名字@SelectedEmployee。名称
} 
 @*这是展示选择作为一个整体模型*@ @if (dropdown已显示){
 
} 
   @SelectedItemText             
  @code { // you may want to make these parameters public List DdlData { get; set; } public string Width { get; set; } = "400px"; public string PopupWidth { get; set; } = "100%"; public string PopupHeight { get; set; } = "300px"; public Employee SelectedEmployee => SelectedItems.Count() > 0 ? SelectedItems.First() : null; // inner workings public IEnumerable SelectedItems { get; set; } = Enumerable.Empty(); private TelerikAnimationContainer dropdown; private bool DropDownShown { get; set; } async Task ToggleDropdown() { DropDownShown = !DropDownShown; await dropdown.ToggleAsync(); } protected void OnSelect(IEnumerable employees) { SelectedItems = new List { employees.FirstOrDefault() }; ToggleDropdown(); // you may want to raise a SelectedItemChanged event here } // you may want to extract the selected text from a text field parameter through reflection, and/or use a parameter for the default text string SelectedItemText => SelectedEmployee != null ? SelectedEmployee.Name : "Select Item (default text)"; //just data generation, in a real case it would come down as a parameter and the component might be generic instead of using hardcoded types and fields protected override async Task OnInitializedAsync() { DdlData = new List(); for (int i = 0; i < 15; i++) { DdlData.Add(new Employee() { EmployeeId = i, Name = "Employee " + i.ToString(), Team = "Team " + i % 3 }); } } public class Employee { public int EmployeeId { get; set; } public string Name { get; set; } public string Team { get; set; } } }

您可能想要投票支持和跟踪一个现成的Telerik组件的实现，该组件将允许您在下拉列表中发布自定义内容在这里．