Extjs 的学习

extjs中textfield的关于印证的一些属性设置

   1: ExtJS的textField 本身具备验证输入值的一些属性和方法,这些属性和方法都在config参数中进行配置。 
1、是否允许空值 
allowBlank : Boolean 
如果是true,则允许,否则不允许,默认是true。 
blankText : String 
如果allowBlank 设置为true,并且那个textField的值为空,则会显示blankText属性的字符串以给出错误提示。 

 

2:最长字符和最短字符 
maxLength : Number 
最长字符(可以达到) 
maxLengthText : String 
超出设定的最长字符时,会显示maxLengthText属性的字符串以给出错误提示。 
minLength : Number 
最短字符(可以达到) 
minLengthText : String 
不足设定的最短字符时,会显示minLengthText属性的字符串以给出错误提示。 

3:正则表达式 
regex : RegExp 
设定正则表达式,eg:/^[abc]$/ 
regexText : String 
输入值违反正则表达式时,会显示regexText属性的字符串以给出错误提示。
可以通过方法isValid( Boolean preventMark ) : Boolean 来得知输入值是否满足所有的限制要求。 
注意: 
所有的错误提示,分两种,一种是在textField下底框上加上红色波浪线,另一种是显示相应的错误提示字符串,同时给出红色波浪线。 
后一种方法需要调用Ext.QuickTips.init();才能生效,默认下,只有前一种方式。 

Sample: 
Ext.onReady(function(){ 
var _win=new Ext.Window({ 
   title : "找回密码", 
  width : 180, 
  layout:"form", 
  labelWidth:60, 
  items:[{ 
   xtype:"textfield", 
   fieldLabel:"你的姓名" , 
   allowBlank:false, 
   blankText :'姓名不能为空', 
   minLength :2 , 
   minLengthText : "姓名最少2个字符", 
   maxLength : 4 , 
   maxLengthText :"姓名至多4个字符", 
   width : 80, 
   regex : /^[abc]{2,4}$/, 
   regexText : "只能输入abc" 
   }], 
   buttons:[ 
     { 
      text:'下一步' 
     },{ 
      text:'取消' 
     }   
   ] 
  }); 
Ext.QuickTips.init(); 
  _win.show(); 
});

posted @ 2015-05-14 10:39  奋斗的无奈  阅读(189)  评论(0编辑  收藏  举报