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条)

报告相同问题?

悬赏问题

  • ¥15 求差集那个函数有问题,有无佬可以解决
  • ¥15 【提问】基于Invest的水源涵养
  • ¥20 微信网友居然可以通过vx号找到我绑的手机号
  • ¥15 寻一个支付宝扫码远程授权登录的软件助手app
  • ¥15 解riccati方程组
  • ¥15 display:none;样式在嵌套结构中的已设置了display样式的元素上不起作用?
  • ¥15 使用rabbitMQ 消息队列作为url源进行多线程爬取时,总有几个url没有处理的问题。
  • ¥15 Ubuntu在安装序列比对软件STAR时出现报错如何解决
  • ¥50 树莓派安卓APK系统签名
  • ¥65 汇编语言除法溢出问题