为Blazor开发Telerik UI

Blazor形式

  • Telerik UI for Blazor表单组件为您提供了创造性的自由,轻松设置您的下一个注册,联系人或其他您的应用程序所需的表单,同时保持简单!
  • 该组件是最大的真正的原生Blazor组件套件的一部分- Telerik UI为Blazor设计,以完美适合任何应用程序的需求。
  • Blazor UI套件还配有专业设计的主题,只需轻按开关,文档处理库,丰富的文档和演示,帮助您立即开始。
为Blazor套件的Telerik UI
Nasa, Visa,微软 福克斯,三星,IBM 世界银行集团,沃尔沃
  • Blazor形式概述

    使用用于Blazor表单组件的Telerik UI创建各种表单很容易。与其他Blazor组件一样,它为您提供了如何构建下一个应用程序的注册页面或联系表单的创造性自由,同时也保持了它的简单-它甚至可以从您的数据模型自动生成!

    查看Blazor表单演示

    Telerik UI for Blazor Form -概述
  • 数据绑定

    如前所述,数据可以绑定到Form组件,该组件将根据您的模型自动生成所有字段,不同的输入元素用于模型中的不同属性(例如,数字将使用)。这将确保您的模型值直接设置用户输入的内容,但也节省您的时间。当为表单提供数据模型时,它将根据模型中的每个属性的类型自动生成输入字段!

    用于Blazor数据绑定的Telerik UI
  • 朝向与布局

    该表单可以适合页面上的任何地方,因为它可以水平方向和垂直方向。它可以渲染单独的列,如果你想要它。配置它,使它在您的用例中最有意义!

    Telerik UI为Blazor的形式-布局
  • 编辑自定义

    Blazor Form UI组件有一个EditorType参数,它提供了一种基于提供的数据类型更改默认字段编辑器的简单方法。对于DateTime类型,您可以灵活选择DatePicker、DateTimePicker或TimePicker,对于字符串字段,您可以选择TextBox或TextArea。

    参见Blazor表单组件中的自定义编辑器示例。

    Telerik Blazor表单UI组件自定义编辑器
  • 表单验证

    表单可以通过内置的Blazor验证进行完整的验证。这意味着您可以使用Required、Range或MaxLength等属性直接在模型上提供验证规则,但表单包含的任何字段也可以单独进行验证。如果您采用这种方法,您甚至不需要编写任何特殊的逻辑。

    不仅如此,用于Blazor的Telerik UI还提供了3个独立的组件来显示验证错误。阅读更多关于ValidationSummaryValidationMessageValidationTooltip
    用于Blazor表单验证的Telerik UI
  • 字段配置

    如果不想从数据模型自动生成表单,可以添加s列表。可以通过多种方式对它们进行定制,如更改外观、数据绑定模型值、添加提示等。

  • Blazor表单活动

    表单支持3个事件- OnSubmit, OnValidSubmit和OnInvalidSubmit。你可以从他们的名字猜出他们是什么时候广播的:

    • OnSubmit-每次提交
    • OnValidSubmit-只在提交有效的输入数据
    • OnInvalidSubmit-仅on提交无效的输入数据
    阅读更多关于Blazor Form Events的文档
    Blazor Events的Telerik UI
  • 表单模板

    Telerik Blazor表单组件可以轻松定制应用程序的标签、表单编辑器组件和验证消息。
    为Blazor表单模板的Telerik UI
  • ID参数

    使用表单组件Id属性在必要的地方引用组件,例如将一个按钮标记为该表单的“提交”按钮。

  • 主题

    Telerik Blazor Form组件有几个内置主题比如Default(我们自己的样式),Material(基于材质设计指导方针)和Bootstrap(看起来像Bootstrap样式以便更好地集成)。你可以很容易地定制任何开箱即用的主题,样式化一个特定的组件实例或创建新的主题来匹配您的颜色和品牌使用Telerik SASS ThemeBuilder应用程序
    为Blazor表单主题的Telerik UI

所有Blazor组件

下一个步骤

发射演示

请参阅用于Blazor的Telerik UI,看看它可以做多少开箱即用的工作。

下载免费试用

尝试为Blazor提供专门的技术支持的Telerik UI。

Baidu
map