Question

我正在尝试在面板中使用模板。模板触发器来自另一个网格项选择。但是这段代码不起作用....

我的代码出了什么问题？只需简单地复制/粘贴我的代码即可运行... 任何人，请你为我解决这个问题？

HTML代码：

<html>
<head>
<link rel="stylesheet" type="text/css" href="extjs/resources/css/ext-all.css">
<script type="text/javascript" src="extjs/ext-all-debug.js">
</script>
<script type="text/javascript">
Ext.onReady(function () {

Ext.create('Ext.data.Store',{
    storeId: 'letterStore',
    fields: ['TitleLetter','LetterType'],
    data: {
    'items': [
        { 'TitleLetter' : 'Keterangan', 'LetterType' : 'Not My Type'},
        { 'TitleLetter' : 'Dua', 'LetterType' : 'Yes This is my Type' }
    ]
    },
    proxy: {
    type: 'memory',
    reader: {
        type: 'json',
        root: 'items'
    }
    }
});


var panel = Ext.create('Ext.panel.Panel',{
    title: 'Testing',
    renderTo: Ext.getBody(),
    items: [
    {
        xtype: 'gridpanel',
        title: 'Grid For TPL',
        bodyPadding: 5,
        listeners: {
        itemclick: function(selModel, record, index, options){

            var detailPanel = this.child('#detailPanel');
            detailPanel().update(record.data);
        }
        },
        store: Ext.data.StoreManager.lookup('letterStore'),
        width: 300,
        height: 300,
        columns: [
        {
            xtype: 'gridcolumn',
            dataIndex: 'TitleLetter',
            text: 'Judul Surat'
        },
        {
            xtype: 'gridcolumn',
            dataIndex: 'LetterType',
            text: 'Tipe Surat'
        },

        ]
    },
    {
        xtype: 'panel',
        itemId: 'detailPanel',
        title: 'Show TPL',
        tpl: ['I am trying to use TPL {TitleLetter}']
    },


    ]


});



});

</script>
</head>
<body>
</body>
</html>

Answer 1

试试这个itemclick活动：

itemclick: function(selModel, record, index, options) {
    // In this function, "this" refers to the grid,
    // so you need to go up to the parent panel then
    // back down to get the detailPanel

    var detailPanel = this.up().down("#detailPanel");
    detailPanel.update(record.data);
}

编辑：一种更快的方法，可以完全绕过Ext.ComponentQuery。

itemclick: function(selModel, record, index, options) {
    var detailPanel = this.ownerCt.getComponent("detailPanel");
    if (detailPanel) {
        detailPanel.update(record.data);
    }
}

为什么这个tpl不起作用？

1 个答案: