extjs - Ext.data.TreeStore ノード内に HTML テーブルを挿入する EXT JS 4x

Question

treepanel ext jsのノード内にhtmlテーブルを挿入する解決策を見つけるのを手伝ってください。

スクリーンショットを見つけます。

Answer 1

以下にサンプルを示します。

http://jsfiddle.net/arunv/kGksk/

始めるのに役立つはずです。

extjs:

var store = Ext.create('Ext.data.TreeStore', {
    root: {
        expanded: true,
        children: [
            { text: "detention", leaf: true },
            { text: "homework", expanded: true, children: [
                { text: "book report", leaf: true },
                { text: "alegrbra", leaf: true}
            ] },
            { text: '<table class="sample_table"><tr><td>11</td><td>12</td></tr><tr><td>21</td><td>22</td></tr></table>', leaf: true }
        ]
    }
});

var tree = Ext.create('Ext.tree.Panel', {
    title: 'Simple Tree',
    useArrows: true,
    width: 500,
    height: 500,
    store: store,
    rootVisible: false,
    renderTo: Ext.getBody()
});

var root = tree.getRootNode();
root.appendChild({ text: '<table class="sample_table"><tr><td>aa</td><td>ab</td></tr><tr><td>ba</td><td>bb</td></tr></table>', leaf: true});

CSS:

.sample_table {
    display: inline-block;
}

.sample_table td {
    border: 1px solid black;
    padding: 5px;
}