博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
【ExtJS】FormPanel表单验证
阅读量:4886 次
发布时间:2019-06-11

本文共 1295 字,大约阅读时间需要 4 分钟。

在Extjs中,FormPane表单提供了各种各样的验证。

在表单验证前需要在onReady的function({})内添加以下代码: 

Ext.QuickTips.init();                 //为组件提供提示信息功能,form的主要提示信息就是客户端验证的错误信息。 

出现错误提醒有两种方法:

1、Ext.form.Field.prototype.msgTarget='side';         //在onReady的function({})内添加

2、msgTarget : 'side'                //在form的各子控件内添加

错误提示参数为:

qtip-当鼠标移动到控件上面时显示提示  //默认值为qtip,使用此种方式必须声明Ext.QuickTips.init();   进行初始化

title-在浏览器的标题显示

under-在控件的底下显示错误提示 

side-在控件右边显示一个错误图标,鼠标指向图标时显示错误提示. 默认值. 

id-[element id]错误提示显示在指定id的HTML元件中。

和表单验证相关的属性及验证顺序:

1.是否为空

allowBlank : Boolean 

blankText : String

 

2.输入数据长度限制

minLength : Number 

minLengthText : String 
maxLength : Number 
maxLengthText : String

 

3.使用vtype验证

vtype : String 

vtypeText : String

 

4.使用validator编写自定义函数验证

validator : Function

 

5.使用自己编写的正则表达式regex

regex : RegExp 

regexText : String

ps:可以进行多项验证,如非空验证与中文验证,同时有效。

代码:

Ext.onReady(function(){

  Ext.QuickTips.init();

  Ext.form.Field.prototype.msgTarget='side';   

  var formPanel = Ext.create('Ext.form.Panel', {

       title: 'Form',

       width: 400,

       layout: 'anchor',

       items: [{

          xtype : 'textfield',

          fieldLabel: 'Name',

      name: 'name',

      anchor : '100%',

      allowBlank : false,

       blankText : '不得为空',

       regex : /[\u4e00-\u9fa5]/,      //自定义验证

       regexText : '只能输入中文' 

      }]

});

 

转载于:https://www.cnblogs.com/linxiong945/p/3941547.html

你可能感兴趣的文章
Struts2 中的数据传输
查看>>
Linux下重要日志文件及查看方式
查看>>
mysql技巧之select count的比较
查看>>
JAVA WEB 过滤器
查看>>
Aliyun发送短信接口调用方法
查看>>
Spring Boot 多环境如何配置
查看>>
用户场景
查看>>
Win7 64位安装VS2013后,远程数据库无法访问,内存访问非法
查看>>
ROS注册级别LEVEL0-6,原来使用GRE通道是不要钱滴
查看>>
【模板】矩阵快速幂
查看>>
解决JSONObject.fromObject数字为null时被转换为0
查看>>
python 的类变量和对象变量
查看>>
java中的三大特性
查看>>
RemoteExt 远程验证
查看>>
HDU 2204(容斥原理)
查看>>
删除文件到回收站rm命令
查看>>
[2013.10.11]饥饿的奶牛
查看>>
Struts2 漏洞系列之S2-001分析
查看>>
响应式网站的开发
查看>>
SQLite使用(二)&&数据类型
查看>>