3

extグリッドパネルにhtmlの代わりにextパネルを追加したくありません。私が今持っているのはこれです：

features: [{
    ftype: 'rowbody',
    getAdditionalData: function (data, rowIndex, record, orig) {
        var headerCt = this.view.headerCt,
            colspan = headerCt.getColumnCount();
        // Usually you would style the my-body-class in CSS file
        return {
            rowBody: '<div style="padding: 1em">' + record.get("description") + '</div>',
            rowBodyCls: "my-body-class",
            rowBodyColspan: colspan
        };
    }
}],

ただし、rowBodyの代わりに、ボタンやその他のレイアウトを追加できる標準のパネルを含めたいと思います。

それは可能ですか？

4

2 に答える 2

1

私は ExtJS 4.2 を使用しています。これを機能させるために、コントローラーのコードは次のようになります。

Ext.define('My.controller.MyController1', {
extend: 'Ext.app.Controller',

onGridPanelExpandbody: function(rowNode, record, expandRow, eOpts) {
    var id = 'group-row-' + record.get('Id');
    var tpl = new Ext.XTemplate('<tpl foreach=".">',
                                '<p> {#}.{$} - {.}</p>', 
                                '</tpl>');
    var el = document.getElementById(id);
    tpl.overwrite(el,record.data);
},

init: function(application) {
    this.control({
        "gridpanel[itemid='usergroupsList'] tableview": {
            expandbody: this.onGridpanelExpandbody
        },
    });
},
}

違いに注意してください、あなたのものgrid、私のコードはgridpanel tableview

于 2013-04-10T06:39:05.003 に答える
0

これは、rowBody をカスタム パネルに置き換えるために行ったことです。

私の見解では、これを作成します：

plugins: [{
    ptype: 'rowexpander',
    rowBodyTpl : ['<div id="group-row-{groupId}"> </div>']
}]

私のコントローラーでは、次のように expandbody リスナーを追加しました。

 'myList grid[itemid = usergroupsList]' : {
    select: this.onSelect,
    expandbody: this.onExpandBody
 }

および onExpandBody

onExpandBody: function(rowNode, record, expandRow) {                
    var row = 'group-row-' + record.get('groupId');
    var elem = document.getElementById(row);
    elem.innerHTML = '';
    var innerPanel = Ext.widget('panel',{                
        html: '<p>'+record.get('description')+'</p>',
        height: 100,
        flex: 1,
        border:0
        }]
    });
    innerPanel.render(row);

毎回パネルを作成する代わりに、この ID にレンダリングするコンポーネントを定義する xTemplate を使用できます。

于 2012-07-18T22:13:33.520 に答える