extJs_定义数据模型、验证数据模型

1.定义数据模型：

//define

    Ext.define("Person",{
        extend:"Ext.data.Model",
        fields: [
            {name: 'name',  type: 'string'},
            {name: 'age',   type: 'int'},
            {name: 'phone', type: 'string'},
            {name: 'alive', type: 'boolean', defaultValue: true}
        ]
    });
    
    //实例化
    var defineData = Ext.create("Person",{
        name:"用户名",
        age:12,
        phone:"cccccc"
    });
    

    alert(defineData.get("name"));

使用API:

defineData.get("name") (获取数据对象中的字段值)

注意：在ext-4.0.7中Ext.regModel已经被废弃，代替方法采用如上的方法

2.验证数据模型：

Ext.onReady(function(){
    
    //自定义验证器
    Ext.apply(Ext.data.validations,{        //通过apply来改造源生来
        
        /**
         * config是传入的定义值
         * value是待验证的值
         */
        newCheck: function(config, value) {
            if (value === undefined || value === null) {
                return false;
            }
            
            var val = value,
                min    = config.newMin,
                max    = config.newmax;
            
            if ((min > val) || (max < val)) {
                this.newCheckMessage = this.newCheckMessage + "正确范围："+min+"~"+max;
                return false;
            } else {
                return true;
            }
        },
        newCheckMessage:"范围出现错误！！！"
    });
    
    
    Ext.data.validations.lengthMessage="长度错误!!!";
    //define
    Ext.define("User",{
        extend:"Ext.data.Model",
        fields: [
            {name: 'name',  type: 'string'},
            {name: 'age',   type: 'int'},
            {name: 'phone', type: 'string'},
            {name: 'alive', type: 'boolean', defaultValue: true}
        ],
        validations:[
            {type: 'length', field: 'name', min: 2, max:26},
            {type: 'length', field: 'phone', min: 7, max:26},
            {type: 'newCheck', field: 'age', newMin: 2, newmax:26}    //自定义验证
        ]
    });
    
    //实例化
    var user = Ext.create("User",{
        name:"b",
        age:67,
        phone:"ccc"
    });
    
    var errs = user.validate();
    var errArray = [];
    errs.each(function(item){
        errArray.push(item.field+"-"+item.message);
    });
    
    alert(errArray.join("\n"));
});

使用的API类：

Ext.apply（改造原生类）

Ext.data.Model （数据模型类）

Ext.data.validations（验证器类）

Ext.data.Errors（验证出错类）

使用技巧：

errs.each(function(item){
        errArray.push(item.field+"-"+item.message);
});

遍历Ext.data.Errors，item属性field为字段，message为字段对应的错误消息

errArray.join("\n")

此join为js的方法，将数组项使用\n连接起来

3.简单数据代理：

Ext.onReady(function(){
    
    //方法1：
    Ext.define("Child",{
        extend:"Ext.data.Model",
        fields: [
            {name: 'name',  type: 'string'},
            {name: 'age',   type: 'int'},
            {name: 'phone', type: 'string'},
        ],
        proxy: {
            type: 'ajax',
            url : 'proxy.jsp'
        }
    });
    
    var c = Ext.ModelManager.getModel("Child");
    c.load(10, {
        scope: this,
        failure: function(record, operation) {
            alert("failure");
        },
        success: function(record, operation) {
            alert(record.data.age);
            alert(record.data.name);
            alert(record.data.phone);
        },
        callback: function(record, operation) {
        }
    });
    
    //方法2：
    Ext.define("Child",{
        extend:"Ext.data.Model",
        fields: [
            {name: 'name',  type: 'string'},
            {name: 'age',   type: 'int'},
            {name: 'phone', type: 'string'},
        ],
        proxy: {
            type: 'ajax',
            url : 'proxy.jsp'
        }
    }).load(10, {
        scope: this,
        failure: function(record, operation) {
            alert("failure");
        },
        success: function(record, operation) {
            alert(record.data.name);
        },
        callback: function(record, operation) {
        }
    });
});

使用API类：

Ext.data.Model （数据模型类）

Ext.ModelManager （）

Ext.data.proxy.Ajax （使用ajax方式代理）

proxy: {
            type: 'ajax',
            url : 'proxy.jsp'
}

这里proxy应该是根据type来决定使用的代理方式

其他：

Ext.ModelManager.getModel("Child")

方法1和方法2基本都使用Ext.data.Model中的load来加载数据，

这里有个Ext.ModelManager.getModel("Child")因该只是为了获取Child的定义？