原文链接:https://www.cnblogs.com/ysmc/p/16082279.html

  故名思意,这个组件的作用我就不再多说了,配合 AutoGenerateColumnAttribute 特性食用更佳,BootstrapBlazor 智能生成神器(一)AutoGenerateColumnAttribute 特性介绍 - 一事冇诚 - 博客园 (cnblogs.com)

组件说明:

  • ValidateForm 组件支持异步设置 Model 值
  • 表单事件为 OnValidSubmit OnInvalidSubmit
  • Model 参数为必填项不允许为空
  • 表单内可以放置多个按钮,通过设置 ButtonType='ButtonType.Submit' 参数是否提交表单
  • 客户端验证机制支持模型的 Required 标签,通过设置 ErrorMessage 参数设置提示信息,未设置时使用默认的英文提示信息
  • 表单默认检查表单内绑定字段值是否合法,如需要检查模型所有字段时可设置 ValidateAllProperties 属性值为 true
  • 通过设置提交按钮 Button 属性 IsAsync 值,设置异步提交表单
  • 表单内组件控件的值修改后 OnFieldChanged 方法被调用

注意事项:

  • 表单内组件通常用法都是使用双向绑定技术对 Model 的属性值进行双向绑定,当其值改变时会导致所在组件 StateHasChanged 方法被调用,即其所在组件或者页面进行刷新重新渲染
  • 组件前置标签默认宽度为 120px 六个汉字,如需要更多汉字请在项目样式文件中更改样式变量 --bs-row-label-width 即可,或者设置表单显示标签在组件上方

Attributes 属性

 
参数
说明
类型
可选值
默认值
Model
表单组件绑定的数据模型,必填属性
object
ValidateAllProperties
是否检查所有字段
bool
true/false
false
ShowRequiredMark
表单内必填项是否显示 * 标记
bool
true/false
true
ShowLabelTooltip
鼠标悬停标签时显示完整信息
bool?
true/false/null
null
ChildContent
子组件模板实例
RenderFragment
OnValidSubmit
表单提交时数据合规检查通过时的回调委托
EventCallback<EditContext>
OnInvalidSubmit
表单提交时数据合规检查未通过时的回调委托
EventCallback<EditContext>

Methods 方法

 
参数
说明
参数
返回值
SetError
设置验证失败方法
PropertyName, ErrorMessage

BootstrapBlazor-ValidateForm 表单验证组件的更多相关文章

  1. Form表单验证组件

    Tyrion是一个基于Python实现的支持多个WEB框架的Form表单验证组件,其完美的支持Tornado.Django.Flask.Bottle Web框架.Tyrion主要有两大重要动能: 表单 ...

  2. jQuery表单验证组件BootstrapValidator

    github:https://github.com/nghuuphuoc/bootstrapvalidator 参考博客:JS组件系列——Form表单验证神器: BootstrapValidator ...

  3. vee-validate表单验证组件

    vee-validate是VUE的基于模板的验证框架,允许您验证输入并显示错误 安装 npm i vee-validate --save 引入 import Vue from 'vue'; impor ...

  4. (七十六)c#Winform自定义控件-表单验证组件

    前提 入行已经7,8年了,一直想做一套漂亮点的自定义控件,于是就有了本系列文章. GitHub:https://github.com/kwwwvagaa/NetWinformControl 码云:ht ...

  5. jQuery html5Validate基于HTML5表单验证插件

    更新于2016-02-25 前面提到的新版目前线上已经可以访问: http://mp.gtimg.cn/old_mp/assets/js/common/ui/Validate.js demo体验狠狠地 ...

  6. JS组件系列——Form表单验证神器: BootstrapValidator

    前言:做Web开发的我们,表单验证是再常见不过的需求了.友好的错误提示能增加用户体验.博主搜索bootstrap表单验证,搜到的结果大部分都是文中的主题:bootstrapvalidator.今天就来 ...

  7. vue 中跨组件的表单验证

    使用的是element写的,里面提供了表单验证. 子组件是这样的 <template> <div> <el-form :model="value" r ...

  8. vue validate多表单验证思考 之前写过一个里外层,现在觉得不合适,应该平行的写,然后都给ret,最后判断ret 再做出反应,这样整体表单的所有验证就都报验证,然后最后提交的时候把组件内的对象合并到总的对象,再提交

    vue validate多表单验证思考 之前写过一个里外层,现在觉得不合适,应该平行的写,然后都给ret,最后判断ret 再做出反应,这样整体表单的所有验证就都报验证,然后最后提交的时候把组件内的对象 ...

  9. 让Angular自定义组件支持form表单验证

    Angular提供了一套非常强大的表单验证库(vue和react都需要第三方库的支持),可以非常方便简单实现web应用程序中的表单验证功能.但是如何让我们自定义的组件也支持验证呢? 我遇到一个需求是封 ...

随机推荐

  1. CSS性能优化的几个技巧

    前言 随着互联网发展至今,对于网站来说,性能显的越来越重要了,CSS作为页面渲染和内容展现的重要环节,影响着用户对整个网站的第一体验.所以,我们需要重视与CSS相关的性能优化. 项目开发初期我们可能因 ...

  2. python中判断为None

    python中经常会有判断一个变量是否为None的情况,这里列举三种方式: if not x if x is None if not x is None *********************** ...

  3. 和风天气WebApi使用教程

    1.首先进入和风天气开发平台,点击右上角的注册进行注册 和风天气开发平台 2.填写注册用的邮箱和密码完成注册,可能还需要手机号,按提示注册完成即可. 3.从和风天气开发平台右上角进入控制台,输入你刚刚 ...

  4. go语言学习入门篇 2--轻量级线程的实现

    很多有过 JVM 相关语言工作经验的程序员或许都遇到过如下问题: 超出 thread 限制导致内存溢出.在作者的笔记本的 linux 上运行,这种情况一般发生在创建了 11500 个左右的 threa ...

  5. 从HDFS的写入和读取中,我发现了点东西

    摘要:从HDFS的写入和读取中,我们能学习到什么? 本文分享自华为云社区<从HDFS的写入和读取中,我们能学习到什么>,作者: breakDawn . 最近开发过程涉及了一些和文件读取有关 ...

  6. MySQL—存储引擎

    主要包括两大引擎  MyISAM,InnoDB 1.MyISAM与InnoDB的区别 2.常规的使用操作 1.MyISAM 节约空间,速度快 2.InnoDB 安全性高,事务的处理,多表操作.Inno ...

  7. 羽夏看Win系统内核——异常篇

    写在前面   此系列是本人一个字一个字码出来的,包括示例和实验截图.由于系统内核的复杂性,故可能有错误或者不全面的地方,如有错误,欢迎批评指正,本教程将会长期更新. 如有好的建议,欢迎反馈.码字不易, ...

  8. 什么是LSA,在OSPF中LSA是什么

    什么是LSA:链路状态通告,它存在于LSU(链路状态更新包) Type 1 LSA:路由器LSA       每个OSPF路由器都会产生路由器LSA,描述了对应设备的物理接口所连接的链路和接口,并指明 ...

  9. 数据库篇:mysql日志类型之 redo、undo、binlog

    前言 可以说mysql的多数特性都是围绕日志文件实现,而其中最重要的有以下三种 redo 日志 undo 日志 binlog 日志 关注公众号,一起交流:微信搜一搜: 潜行前行 1 redo日志 in ...

  10. 第九届蓝桥杯 C组 Java 等腰三角形

    目录 题目 解答 题目 题目描述 本题目要求你在控制台输出一个由数字组成的等腰三角形. 具体的步骤是: 1. 先用1,2,3,...的自然数拼一个足够长的串 2. 用这个串填充三角形的三条边.从上方顶 ...