您的位置:首页 > Web前端 > JavaScript

extjs-model数据加载

2016-01-06 17:49 671 查看
1、Model代表应用程序管理的一些对象。例如,我们可能会为 我们想在系统中建模的现实世界中的一些物体像使用者、产品和汽车等定义一个Model。这些Model在 模型管理器中注册,被仓库使用, 而这些仓库又被许多 Ext中许多与数据绑定的组件使用。

2、总之这个会很常用。

3、model和数组、对象都有着关联,所以我写了两个方法。仅供参考,还有model的load方法,跨域加载事例。

Ext.onReady(function(){
Ext.define('User', {
extend: 'Ext.data.Model',
fields: [
{name: 'name',     type: 'string'},
{name: 'age',      type: 'int'},
{name: 'phone',    type: 'string',convert:function(value){
if(Ext.isString(value) && !Ext.String.startsWith(value,'+86')){
return '+86'+value;
}
}},
{name: 'gender',   type: 'string'},
{name: 'username', type: 'string'},
{name: 'alive',    type: 'boolean', defaultValue: true}
],
flag: true,
validations: [
{type: 'presence',  field: 'age'},
{type: 'length',    field: 'name',     min: 2},
{type: 'inclusion', field: 'gender',   list: ['Male', 'Female']},
{type: 'exclusion', field: 'username', list: ['Admin', 'Operator']},
{type: 'format',    field: 'username', matcher: /([a-z]+)[0-9]{2,3}/}
]
});
var instance = Ext.create('User', {
name: 'tom',
gender: 'Male',
phone : '15150003674',
username: 'edspencer'
});
Logger.printf(instance.flag);
//User属性的修改prototype
User.prototype.flag = false
Logger.printf(instance.flag);

//isValid( ) : Boolean
//检查模型是否有效。见validate.
Logger.printf(instance.isValid());
//getData( Boolean includeAssociated ) : Object
//获取每个字段的所有值,并将它们作为 一个对象返回。
Logger.printfobj(instance.getData());
//raw : Object
//创建本模型的原始数据,如果本模型是通过reader创建的
Logger.printfobj(instance.raw);

//Ext.data.Errors
var errors = instance.validate();
Logger.printf(errors.isValid());
//obj--->model
var jerry = {
name: 'jerry',
gender: 'Male',
phone : '15150003674',
username: 'edspencer',
salary :'9000'
}
instance = obj2model(jerry,instance)
Logger.printfobj(instance.getData());
//arr(obj)--->modelarr
var tom = {
name: 'tom',
gender: 'Male',
phone : '15150003674',
username: 'edspencer',
salary :'9000'
};
var arr = [];
arr.push(tom);
arr.push(jerry);
instance = arr2modelarr(arr,instance);

//------------------model_jsonp------------------
Ext.define('UserModel', {
extend: 'Ext.data.Model',
//没有对应到data中
fields: [
{name: 'id',     type: 'int'},
{name: 'name',     type: 'string'},
{name: 'age',     type: 'int'},
{name : 'email',    type :'string'}
],
proxy: {
type: 'jsonp',
url : 'users.json',
reader: {
type: 'json',
root: 'users'
}
}
});
//异步加载模型
UserModel.load(1,{
scope: this,
failure: function(record, operation,s,s) {
//do something if the load failed
record
},
success: function(record, operation) {
//do something if the load succeeded
var arr = operation.response.users;
Logger.printfarr(arr)
var usermodel = Ext.create('UserModel');
var instanceModel = arr2modelarr(arr,usermodel);
arr =  modelarr2arr(instanceModel)
Logger.printfarr(arr)
},
callback: function(record, operation,s ,s ) {
//do something whether the load succeeded or failed
record
}
});

})

//obj--->model:model
function obj2model(obj,model){
if(!model.isModel||Ext.isEmpty(obj)||!Ext.isObject(obj))return null;
var keyarr = Ext.Object.getKeys(model.getData())
Ext.Object.each(obj, function(key, value, myself) {
if(Ext.Array.contains(keyarr,key)){
if(Ext.isObject(value)){
console.error('Objects can not contain objects');
return null;
}
model.set(key,value||'')
}
});
return model;
}
//arr--->model[]:model[]
function arr2modelarr(arr,model){
if(!model.isModel||Ext.isEmpty(arr)||!Ext.isArray(arr))return null;
var modelarr = []
Ext.each(arr,function(item){
modelarr.push(obj2model(item,model));
})
return modelarr;
}
//model[]--->arr:arr
function modelarr2arr(modelarr){
if(Ext.isEmpty(modelarr)||!Ext.isArray(modelarr))return null;
var arr = [];
Ext.each(modelarr,function(item){
if(item.isModel){
arr.push(item.getData()||'')
}
})
return arr;
}

//记录器
Ext.define('Logger', {
singleton: true,
log: function(msg) {
console.log(msg);
},
error : function(msg){
console.error(msg)
},
printferror : function(msg){
this.error(Ext.id('','num:')+'   '+msg);
},
printf : function(msg){
this.log(Ext.id('','num:')+'   '+msg);
},
printf2 : function(val,msg){
this.printf(val+'--'+msg);
},
printfobj : function(obj){
var s = '';
if(Ext.isObject(obj)){
Ext.Object.each(obj, function(key, value, myself) {
s+=key + ":" + (Ext.isObject(value)?'object':value)+"  ";
})
}
if(s)this.printf(s);
},
printfarr : function(arr){
var s = '';
Ext.each(arr,function(item){
if(Ext.isObject(item)){
Ext.Object.each(item, function(key, value, myself) {
s+=key + ":" + (Ext.isObject(value)?'object':value)+"  ";
})
}
});
this.printf(s?s:arr)
}
});


users.json:

Ext.data.JsonP.callback1(
{
users : [{
id : 1,
name : "Ed Spencer",
age : 22,
email : "ed@sencha.com"
}, {
id : 2,
name : "tom",
age : 22,
email : "tom@sencha.com"
}
],
success : true
});
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: