WeX5動態生成data,並繫結動態生成的list
因為專案需要,無法使用提前弄好靜態的,所以,將demo整理下,發上來,供各位朋友參考
define(function(require){
var $ = require("jquery");
var justep = require("$UI/system/lib/justep");
var Data = require("$UI/system/components/justep/data/data");
var List = require("$UI/system/components/justep/list/list");
var Model = function(){
this.callParent();
//動態建立data元件,詳細見system/components/justep/data/demo/data.w
new Data(this, {
xid : 'mainData',//和this.mainData一致
defCols : {
sID : {
type : 'String',
label : 'ID'
},
sName : {
type : 'String',
label : '名字',
rules : {
required : {
params : true,
message : '名字必須有值'
}
}
},
sAge : {
type : 'Integer',
label : '年齡'
}
},
idColumn : 'sID'
});
};
Model.prototype.modelLoad = function(event){
this.comp('mainData').newData({defaultValues:[{sID:'001',sName:'xiaomin',sAge:18},{sID:'002',sName:'zhang',sAge:38}]});
//list元件動態建立說明http://doc.wex5.com/?p=7598#005
var cfg = {
xid: 'list1',
autoLoad: true,
data: 'mainData',
template: '<ul class="x-list-template" xid="listTemplateUl1"><li xid="li2"><span bind-text=ref(\'sName\')/></li></ul>',
parentNode: this.getElementByXid('content1')
};
new List(cfg);
};
return Model;
});