使用enyo.js将数据动态插入表中

Insert data dynamically into table using enyo.js

本文关键字:插入 动态 数据 enyo js 使用      更新时间:2023-09-26

我得到了15个名称,我想通过点击一个按钮将其设置为一个表或列表。我想使用for循环插入数据。这样我就可以在点击按钮后得到所有的名字。我试了一下清单。在这个列表中,名称是在加载时加载的。但单击按钮时,它不会加载数据。所以我希望它加载到enyo.js中的表中。谢谢

给你一个小小的Fiddle。http://jsfiddle.net/joopmicroop/ntN6t/

enyo.kind({
    name: 'App',
    kind: enyo.Control,
    components: [
        {kind: 'FittableRows', components:[
           {name: 'header', kind: 'onyx.Toolbar', components: [
                {kind: "onyx.Button", content: "Load content", ontap: "tapload"}, 
           ]},
            {name: 'listplaceholder',fit:true,},
        ]}
    ],
    tapload:function(inSender, inEvent){
        var data = ['item 1', 'item 2','item 3'];
        for (var i in data){
            if(i%2){
                this.$.listplaceholder.createComponent({index:i, style:'background-color:#AAA;', content:'list '+data[i]}); 
            }else{
                this.$.listplaceholder.createComponent({index:i, style:'background-color:#CCC;', content:'list '+data[i]}); 
            }                              
        }
    this.$.listplaceholder.render(); 
    } 
});​

我修改了fiddle,所以点击按钮调用函数来"加载"数据。然后将其绑定到一个事件中,事件处理程序加载该列表。如果你打电话给一个回拨的服务,你会想这样做。

http://jsfiddle.net/pcimino/GnEBK/

handlers: {
    onLoadList: 'loadList'
},
retrieveData: function(inSender, inEvent) {
    // simulates getting data form a web service
    var data = ['item 1', 'item 2','item 3'];
    this.waterfall('onLoadList', {data: data});
    return true;
}