Progress Telerik UI for Blazor

Blazor多列组合框

  • Blazor MultiColumnComboBox UI组件允许用户以类似表格的结构从预定义的列表中选择值,同时允许用户输入。支持过滤,分组,验证和模板。
  • 该组件是最大的真正的原生Blazor组件套件的一部分- Telerik UI为Blazor设计,完全适合任何应用程序的需求。
  • Blazor UI套件还带有专业设计的主题,只需翻转开关,文档处理库,丰富的文档和演示,帮助您立即开始。
Telerik UI的Blazor套件
Nasa, Visa,微软 福克斯,三星,IBM 世界银行集团,沃尔沃
  • MultiColumnComboBox概述

    用于Blazor的Telerik MultiColumnComboBox是一个编辑器UI组件,允许您以类似表格的结构从预定义的列表中选择值。本质上,它是一个具有丰富功能的高级选择元素,包括数据绑定、过滤、分组、通过模板呈现自定义内容、配置其外观的多个选项、自定义值的输入、验证、消息的内置本地化、可访问性和键盘导航。

    参见Blazor MultiColumnComboBox UI组件演示尝试Telerik Blazor REPL基于浏览器的代码运行器中的组件。

    Telerik UI Blazor MultiColumnComboBox组件
  • MultiColumnComboBox过滤

    Telerik Blazor MultiColumnComboBox为用户提供了一种简单的方法来查找预定义值列表中的项目。当专注于多列组合框组件时,用户可以开始输入他们正在查找的部分文本,并且项目列表将使用匹配给定条件的建议项目子列表填充。该组件还通过FilterOperator参数提供默认筛选操作符的配置。

    查看如何在Blazor MultiColumnComboBox UI组件中应用过滤。

    用户界面的Blazor多列combobox - filtering
  • MultiColumnComboBox分组

    您可以将Blazor MultiColumnComboBox列表项组织成组,使搜索和浏览值更容易,更直观。要启用项目分组,您所要做的就是为GroupField参数提供一个值,该值与数据集中的字段相匹配。

    查看如何在Blazor MultiColumnComboBox UI组件中分组项目。

    用户界面Blazor MultiColumnComboBox-Grouping
  • 渲染自定义内容

    使用可用于Telerik Blazor MultiColumnComboBox的多个模板选项,您可以在组件的每个部分中呈现自定义内容:在项目列表的上方或下方(Header和Footer模板),在MultiColumnComboBox (RowTemplate)的每一行中的自定义内容,以及通过每个列的HeaderTemplate和template进行单独的单元格自定义。

    此外,您可以使用Class和HeaderClass参数,让您在列的单元格和标题上应用CSS类。

    了解如何使用模板自定义Blazor MultiColumnComboBox UI组件。

    用户界面Blazor MultiColumnComboBox-Templates
  • MultiColumnComboBox外观

    内置参数FillMode,圆润和大小参数提供额外的自定义Blazor多列组合框外观,让您轻松地塑造它在任何你需要的方式。

    尝试Blazor MultiColumnComboBox组件的外观设置。

  • MultiColumnComboBox自定义输入

    与预定义项目列表一起,Blazor的MultiColumnComboBox可以配置为允许应用程序用户输入自定义值。在这个场景中,组件的行为类似于下拉列表和文本框的组合。为了接受输入的项目,用户只需要按Enter或模糊输入。

    了解如何添加新项目到Blazor多列组合框。

  • MultiColumnComboBox验证

    Blazor MultiColumnComboBox的Telerik UI支持通过模型中的数据注释进行验证。这意味着需要的和无效的值将很容易被验证,并且相应的验证消息可以显示给应用程序用户。

    尝试使用数据注释的Blazor MultiColumnComboBox验证。

  • MultiColumnComboBox虚拟化

    当您处理大型数据集时,您可以利用Blazor MultiColumnComboBox虚拟化特性。通过启用它,您可以按需获取项目,而不是一次加载所有数据。您可以控制每次用户滚动组件时需要加载的项的数量。要启用虚拟化特性,您需要设置ScrollMode、ListHeight、ItemHeight和PageSize参数,并让MultiColumnComboBox自动完成所有工作和计算。

    在Blazor MultiColumnComboBox组件中了解如何对大量数据使用虚拟化。

  • MultiColumnComboBox可访问性

    Blazor MultiColumnComboBox UI组件的Telerik UI在构建时考虑了可访问性,并符合国际web可访问性标准,包括WCAG 2.1, Section 508和WAI-ARIA屏幕阅读器属性。

  • 多栏组合框键盘导航

    像Blazor组件的Telerik UI的其他部分一样,MultiColumnComboBox带有内置的键盘导航,这意味着用户可以仅用键盘执行其中的所有操作。

    尝试Blazor multiolumncombobox的内置键盘导航。

    Telerik UI Blazor键盘导航和可访问性
  • MultiColumnComboBox本地化

    multiolumncombobox具有内置的本地化支持,这使得它很容易将文本翻译为您的Blazor应用程序可能需要的任何语言。UI组件包含本地化的字符串(如Clear、Open、No Data等),可以通过资源文件进行定制。

    了解如何在Blazor MultiColumnComboBox UI组件中翻译消息。

    globalization-localization1cb67e42ce5b4cb7a1a69f2792f1c888
  • MultiColumnComboBox主题

    Blazor MultiColumnComboBox组件的Telerik UI带有几个 内置主题和色板, 包括默认(我们自己的样式),材料(基于材料设计指南),和Bootstrap。

    用户界面Blazor MultiColumnComboBox-Theming

所有Blazor组件

下一个步骤

发射演示

看看Telerik UI的Blazor在行动,并检查它可以做多少开箱即用。

下载免费试用

尝试Telerik UI Blazor与专门的技术支持。

Baidu
map