嵌套网格IN EXTJS

时间:2011-04-12 09:01:21

标签: extjs

HI

如何在ExtJS中设计嵌套网格 请提供一些示例(如何在ExtJS GridPanel中使用RowExpander)

3 个答案:

答案 0 :(得分:7)

尝试这样的事情:

 //Create the Row Expander.
var expander = new Ext.ux.grid.RowExpander({
     tpl : new Ext.Template('<div id="myrow-{Id}" ></div>')
});

//Define the function to be called when the row is expanded.
function expandedRow(obj, record, body, rowIndex){
    //absId parameter for the http request to get the absence details.
    var absId = record.get('Id');

    var dynamicStore = //the new store for the nested grid.

    //Use Id to give each grid a unique identifier. The Id is used in the row expander tpl.
    //and in the grid.render("ID") method.
    var row = "myrow-" + record.get("Id");
    var id2 = "mygrid-" + record.get("Id");  

   //Create the nested grid.         
   var gridX = new Ext.grid.GridPanel({
        store: dynamicStore,
        stripeRows: true,
        columns: [
            //columns
        ],
        height: 120,
        id: id2                  
    });        

    //Render the grid to the row expander template(tpl).
    gridX.render(row);
    gridX.getEl().swallowEvent([ 'mouseover', 'mousedown', 'click', 'dblclick' ]);
}

//Add an expand listener to the Row Expander.
expander.on('expand', expandedRow);

您可以找到有关此Here

的更多信息

答案 1 :(得分:1)

如何在网格中使用RowExpander?这是一个例子:http://dev.sencha.com/deploy/dev/examples/grid/grid-plugins.html

可以从http://dev.sencha.com/deploy/dev/examples/

找到更多示例

答案 2 :(得分:1)

可以像其他人提到的那样去做,但我建议不要这样做。

原因: 由于子网格未被正确销毁而导致内存泄漏。 选择模型无法正常工作 事件搞砸了。