• BootstrapBlazorValidateForm 表单验证组件


    原文链接: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
  • 相关阅读:
    ubuntu安装node.js+express+mongodb
    Linux(Ubuntu)下安装NodeJs
    Nodejs的Express完成安装指导
    【详解】ERP、APS与MES系统是什么?
    linux常用命令
    Linux命令集合
    sql 以逗号分割成多行数据
    【项目管理工具】SVN
    富文本编辑器
    cookie的跨页面传值
  • 原文地址:https://www.cnblogs.com/ysmc/p/16082279.html
Copyright © 2020-2023  润新知