extjs表单FormPanel验证
在Extjs中，FormPane表单提供了各种各样的验证，先总结一下
在讲解表单验证前需要说一下和其相关的一下设置
//在onReady的function（{}）添加以下两行代码，
Ext.QuickTips.init();???//为组件提供提示信息功能，form的主要提示信息就是客户端验证的错误信息。
Ext.form.Field.prototype.msgTarget='side';???????? //指示错误出现的方式，包含的值为
qtip-当鼠标移动到控件上面时显示提示? //默认值为qtip，使用此种方式必须声明Ext.QuickTips.init();???进行初始化
title-在浏览器的标题显示
under-在控件的底下显示错误提示
side-在控件右边显示一个错误图标，鼠标指向图标时显示错误提示. 默认值.
id-[element id]错误提示显示在指定id的HTML元件中
?
表单项的显示错误的方式也可以修改各项的msgTarget属性
例如：
//扩展VTypes增加id验证方式,和年龄验证Ext.apply(Ext.form.VTypes,{'age' : function(_v){if(/^\d+$/.test(_v)){//判断必须是数字 var _age = parseInt(_v);//增加业务逻辑,小于100的数字才符合年龄if(0 < _age && _age <100){return true ;}}return false ;},ageText : '年龄必须为数字，并且不能超过100岁，格式为23' , //出错信息后的默认提示信息 ageMask:/[0-9]/i //键盘输入时的校验})Ext.onReady(function(){Ext.QuickTips.init(); //为组件提供提示信息功能，form的主要提示信息就是客户端验证的错误信息。Ext.form.Field.prototype.msgTarget='side'; var form = new Ext.form.FormPanel({frame : true ,defaultType : 'textfield' ,buttonAlign : 'center' ,labelAlign : 'right' ,labelWidth : 70 ,items : [{xtype : 'textfield',fieldLabel : '编号' ,name : 'id' ,allowBlank : false ,msgTarget : 'qtip'},{fieldLabel : '名称' ,name : 'name' ,regex : /[\u4e00-\u9fa5]/, //正则表达式在/...../之间. [\u4e00-\u9fa5] : 只能输入中文. regexText:"只能输入中文!", //正则表达式错误提示 allowBlank : false //此验证依然有效.不许为空. },{fieldLabel : '年龄' ,name : 'age',allowBlank : false ,/*minLength : 1 ,minText: '最少输入1位数字',maxLength : 3 ,minText: '最多输入3位数字',*/vtype : 'age'//,//vtypeText : '覆盖age默认的错误提示' }] ,buttons : [{text : '确定' ,handler : function(){form.getForm().isValid();}} ]});});?
?
?
?
?
?