为Blazor的Telerik UI?下载30天免费试用

DropDownList数据绑定

本文解释了向DropDownList组件提供数据的不同方法、与数据绑定相关的属性及其结果。

有关值绑定和数据绑定的详细信息以及它们之间的区别,请参见值绑定vs数据绑定篇文章。

有两种绑定数据的关键方法:

还有一些你可能会发现有用的考虑,比如显示DefaultText当值超出数据源范围时:

原始类型

您可以将DropDownList绑定到一个简单的数据集合。当您有一个供用户选择的具体选项列表时,它们的字符串表示通常适合显示,您不需要特殊的模型。

将下拉列表绑定到基本类型(例如int字符串),你需要

  1. 提供一个IEnumerable < TItem >所需类型的数据财产
  2. 设置一个对应的价值.如果价值,它将用来自数据源的第一项填充。

将下拉列表绑定到原语类型的数据

绑定到原始类型的List (stirng, int,…)  @code {protected List MyList = new List() {"first", "second", "third"};protected string MyItem {get;设置;} //当组件初始化受保护覆盖void OnInitialized() {MyItem = "second";}}

绑定到模型

您可以将DropDownList绑定到应用程序中的模型。当您有一个有限列表的数字表示(例如,公司的部门),并且您希望用户根据友好的文本名称选择它们时,这是非常有用的。

将下拉列表绑定到一个模型:

  1. 填充它数据参数与下拉列表中想要的项的集合。
  2. 设置文本框而且ValueField参数,以指向模型的相应属性名。
  3. 设置价值属性设置为组件的初始值(可选)。

文本框而且ValueField参数必须指向模型属性,这些属性为原始的类型(int字符串等)。的价值而且ValueField类型必须匹配并且是基本的。

将下拉列表绑定到模型

绑定到模型集合  @code{//在实际情况下,模型通常在一个单独的文件//模型类型和值字段类型必须提供给dropdpownlist公共类MyDdlModel{公共int MyValueField {get;设置;}公共字符串MyTextField {get;设置;}} int selectedValue {get;设置;} //当组件初始化受保护覆盖void OnInitialized()时定义一个预先选择的值{selectedValue = 3;} IEnumerable myDdlData = Enumerable。范围(20)。Select(x => new MyDdlModel {MyTextField = "item " + x, MyValueField = x});}

如果您正在从描述下拉项的视图模型中寻找更多字段,而不仅仅是价值,请参阅从下拉菜单中获取模型知识库文章和OnChange事件。

你也可以回顾/加入讨论并为这个请求投票:绑定DropDownList值到复杂模型

注意事项

DropDownList组件试图根据所提供的参数推断其模型和值的类型数据和初始价值.这影响了它的方式获得参考发生了什么如果不能提供数据或值.提供一个不在数据源中的值需要考虑的是应用程序,因为组件不会改变它。

值超出范围

价值中的值与应用程序提供的值不匹配ValueField数据集合时,DropDownList组件将不会更改价值或者选择一个新项。在一般情况下,它将显示为空白,表示没有从其数据中选择任何内容。

如果你设置了DefaultText价值匹配默认的类型的值(例如,0对于一个int对于一个int ?字符串),你会看到DefaultText.一个价值这是非-默认的不会显示DefaultText

处理这种“意外”值取决于应用程序—例如,通过防御检查,或通过表单验证,或在设置新的价值

组件引用

DropDownList是一个泛型组件,它的类型来自于它绑定的模型和值字段类型。当绑定到基元类型时,引用仅属于该基元类型。

当绑定到原始值  @code{//泛型组件的类型由你传递给它的模型的类型和它的值字段telerikk . blazor . components的类型决定。 myDdlRef;protected List MyList = new List() {"first", "second", "third"};字符串initialValue {get;设置;} //当组件初始化受保护覆盖void OnInitialized() {initialValue = "third";}}
当绑定到模型集合时引用  @code{//泛型组件的类型由你传递给它的模型的类型和它的值字段Telerik.Blazor.Components的类型决定。TelerikDropDownList myDdlRef;IEnumerable myDdlData = Enumerable。范围(20)。Select(x => new MyDdlModel {MyTextField = "item " + x, MyValueField = x});public class MyDdlModel {public int MyValueField {get;设置;}公共字符串MyTextField {get;设置;}}}

丢失的值或数据

如果你不能提供任何一个价值,或数据的类型属性时,或两者同时进行,则需要将相应的类型属性设置为TItem而且TValue属性如下所示。

如果不能提供值或数据,请配置下拉列表

如果没有提供值或数据,如何声明下拉列表  @code{公共类MyDdlModel //TItem匹配模型的类型{公共int MyValueField {get;设置;} //TValue匹配值域公共字符串MyTextField {get;设置;IEnumerable myDdlData = Enumerable。范围(20)。Select(x => new MyDdlModel {MyTextField = "item " + x, MyValueField = x});//如果"myDdlData"对象初始为空并在某些事件中填充,则应用相同的配置}

另请参阅

在本文中
Baidu
map