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',
        300,
        height:200,
        closable:false,
        resizable:false,
        constrain:true,
        items:[form]        
    });
    win.show();
})