ExtJS4-数据验证

例子：

<script type="text/javascript">
    <!--在页面加载完成后调用JS代码-->
    Ext.onReady(function(){
    Ext.create('Ext.form.Panel', {
        frame: true,
        title: 'Form Fields Validation',
        width: 340,
        bodyPadding: 5,
        renderTo: 'myForm',
        fieldDefaults: {
        labelAlign: 'left',
        labelWidth: 90,
        anchor: '100%',
        //错误提示显示在下方，还可以配置为side、title、none
        msgTarget: 'under'
        },
        items: [{
        xtype: 'textfield',
        name: 'textfield1',
        fieldLabel: '必须输入',
        //不允许为空验证
        allowBlank: false //1
        },{
        xtype: 'textfield',
        name: 'textfield2',
        fieldLabel: '知道两个字符',
        //输入的字符长度验证（至少输入2个字符）
        minLength: 2 //2
        },{
        xtype: 'textfield',
        name: 'textfield3',
        fieldLabel: '最长5个字符',
        //输入的字符长度验证（最多输入2个字符）
        maxLength: 5 //3
        },{
        xtype: 'textfield',
        name: 'textfield7',
        fieldLabel: '正则表达式验证电话号码',
        //通过正则表达式验证
        regex: /^\d{3}-\d{3}-\d{4}$/, //4
        regexText: 'Must be in the format xxx-xxx-xxxx'
        },{
        xtype: 'textfield',
        name: 'textfield4',
        fieldLabel: '验证用户输入的是否为email',
        //已经定义好的验证，请通过文档查看vtype
        vtype: 'email' //5
        },{
        xtype: 'textfield',
        name: 'textfield6',
        fieldLabel: '验证用户输入的是否是URL',
        vtype: 'url' //8
        }]
        });
    });
</script>

效果图：