iteye_9116 2010-10-23 19:24
浏览 522
已采纳

Ext.Template 及 Ext.XTemplate怎么用呀?

 

我想用模板循环以表格的形式把数据显示到form中。怎么做呀?下面是我找的一点代码:

 

急呀!高手出来指教一下! 下面的代码为什么显示不出来呢?

 

--ExtJS代码:------------------------

 

Ext.onReady(function(){  

 //定义模板 使用标签tpl和操作符for  

        var tpl1 = new Ext.XTemplate(  

            '<table border=1 cellpadding=0 cellspacing = 0>',  

            '<tr><td width=90 >姓名</td><td width=90 >年龄</td></tr>',  

            '<tpl for=".">',  

            '<tr><td>{name}</td><td>{age}</td></tr>',  

            '</tpl>',  

            '</table>'  

        );

 

 

 //定义组合框模板  xindex:若是循环模板,这是当前循环的索引index(从1开始)。  

        //             values:当前作用域下的值    

        var itemTpl = new Ext.XTemplate(  

            '<tpl for=".">',  

            '<div class="x-combo-list-item {[xindex % 2 == 0 ? "even" : "odd"]}">',  

            '{#} :{[this.check(values)]}</div>',  

            '</tpl>',  

            {  

                check : function (values) {  

                    if(values.value > 2 ){  

                        return "<font color=red>"+values.item+"</font>";  

                    }else {  

                        return "<font color=blue>"+values.item+"</font>";  

                    }  

                }  

            }  

        )  

        new Ext.form.FormPanel({  

            applyTo :'target',  

            title:'在Extjs组件中使用模板',  

            labelSeparator :':',//分隔符  

            height : 100,  

            frame : true,  

            width : 350,  

            items : [  

                new Ext.form.ComboBox({  

                    fieldLabel:'combo',  

                    displayField:'item',  

                    valueField:'value',  

                    tpl : itemTpl,//引入自定义模板  

                    editable : false,  

                    mode: 'local',  

                    triggerAction: 'all',  

                    store : new Ext.data.SimpleStore({  

                        fields: ['item','value'],  

                        data : [['条目1',1],['条目2',2],['条目3',3],  

                                ['条目4',4],['条目5',5],['条目6',6]]  

                    })  

                })  

            ]  

        });  

 

 

//定义模板数据  

        var data1 = [  

            {name:'张三',age:20},  

            {name:'李四',age:25},  

            {name:'王五',age:27},  

            {name:'赵六',age:26}  

        ];  

 

 

//模板值和模板进行组合并将新生成的节点插入到id为'tpl-table'的元素中     

tpl1.append('tpl-1',data1); 

 

});

 

 

--html代码:------------------------

 <div id='tpl-1'>1</div>  

 

<br>  

    <div id="target">tgt</div>  

 

  • 写回答

3条回答 默认 最新

  • lizhiyezi 2010-10-25 17:44
    关注

    store.load();
    需要放在Ext.DataView 后面

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
查看更多回答(2条)

报告相同问题?

悬赏问题

  • ¥20 sub地址DHCP问题
  • ¥15 delta降尺度计算的一些细节,有偿
  • ¥15 Arduino红外遥控代码有问题
  • ¥15 数值计算离散正交多项式
  • ¥30 数值计算均差系数编程
  • ¥15 redis-full-check比较 两个集群的数据出错
  • ¥15 Matlab编程问题
  • ¥15 训练的多模态特征融合模型准确度很低怎么办
  • ¥15 kylin启动报错log4j类冲突
  • ¥15 超声波模块测距控制点灯,灯的闪烁很不稳定,经过调试发现测的距离偏大