95.Extjs 表单中自定义的验证规则 VTypes

1

 Ext.onReady(function(){

     Ext.QuickTips.init();
     //重写 (自定义)xtype
     Ext.apply(Ext.form.VTypes,{
         repetition:function(val,field){
             if(field.repetition){
                 var pass = Ext.getCmp(field.repetition.compareTo);
                 if(Ext.isEmpty(pass)){
                     Ext.Msg.show({
                         title:'Error',
                         msg:'没有要对比的组件',
                         icon:Ext.Msg.error,
                         buttons:Ext.Msg.OK
                     });
                     //return;
                 }
                 if(val == pass.getValue()){
                     return true;
                 }else{
                     return false;
                 }
             }
         },
         repetitionText:"两次输入的密码不一致"
     });

     //定义登录表单
     var form = new Ext.form.FormPanel({
         id:'loginform',
         labelAlign:'right',
         buttonAlign:'center',
         frame:true,
         monitorValid:true,
         items:[{
             xtype:'textfield',
             fieldLabel:'姓名',
             name:'username',
             minLength:6,
             allowBlank:false
         },{
             id:'password',
             xtype:'textfield',
             inputType:'password',
             fieldLabel:'密码',
             name:'password'
         },{
             id:'repasswda',
             xtype:'textfield',
             inputType:'password',
             fieldLabel:'确认密码',
             name:'compasswd',
             vtype:"repetition",
             repetition:{ compareTo: 'password' }

         }],
         buttons:[
             {text:'提交',
              handler:loginSubmit,
              formBind:true
             },
             {text:'重置',
              handler:function(){
                  Ext.getCmp('loginform').getForm.reset();
              }
             }
         ]
     });
     //表单定义结束

     //提交表单是触发的函数
     function loginSubmit(){
         Ext.getCmp('loginform').getForm().submit({ //这里就把表单的值带过去了
             url:'login.php',
             success:function(form,action){
                 //TODO 跳转到其他页面
             },
             failure:function(form,action){
                 alert(action.result.msg);
             }
         });
     }

     //定义一个窗口

     var win = new Ext.Window({
         title:'用户登录',
         layout:'fit',
         width:300,
         height:200,
         closable:false,
         resizable:false,
         constrain:true,
         items:[form]
     });
     win.show();
 })