初始化后加载时未呈现网格面板数据答案

【问题标题】：GridPanel data not rendered when loaded after initalization初始化后加载时未呈现网格面板数据
【发布时间】：2010-11-29 10:15:41
【问题描述】：

我对 ExtJS 很陌生，所以这可能是个愚蠢的问题。

我有一个自定义面板，扩展了 Ext 的 Panel 类，它执行 AJAX 调用并且应该使用获得的数据创建和填充内部 GridPanel（列是动态的，所以我不能提前准备网格）。 webService的第一个参数是封装在webService对象中的AJAX调用成功时用数据调用的回调函数。

到目前为止，我正在尝试用硬编码数据填充我的TablePortlet，当直接从constructor 调用renderCallback 方法时它运行良好，但如果在AJAX 请求之后调用则根本不起作用。我可以在 Firebug 中追踪到，在这种情况下，该方法仍然被调用，context 有效，store 填充了数据，但没有渲染任何内容。

我应该如何正确填充数据？是否有我遗漏的 render 方法？

TablePortlet = Ext.extend(Ext.Panel, {

    constructor: function(portletTitle, sourceId, webService)
    {
        var context = this;

        TablePortlet.superclass.constructor.call(this, {
            title: portletTitle,
            anchor: '100%',
            frame:  true,
            collapsible:    true,
            draggable:  true
        });

        var grid = null;

        function renderCallback(data)
        {
            if (grid != null)
                context.remove(grid);

            var store = new Ext.data.ArrayStore({
                autoDestroy: true,
                fields:[{name:"a"}, {name:"b"}, {name:"c"}, {name:'d'}],
            });
            store.loadData([['1','2','1','2'],['3','4','3','4']]);

            grid = new Ext.grid.GridPanel({
                store: store,
                colModel: new Ext.grid.ColumnModel([
                    {header: 'A', dataIndex:'a'},
                    {header: 'B', dataIndex:'b'},
                    {header: 'C', dataIndex: 'c'},
                    {header: 'D', dataIndex: 'd'},
                ]),
                width: '100%',
                autoHeight: true,
                view: new Ext.grid.GridView(),
                viewConfig: {
                    forceFit: true
                },
                layout: 'fit'
            });

            context.add(grid);
        }

        this.on('render', function() 
        {
            webService.GetTable(renderCallback, sourceId);
        });
    }
});

【问题讨论】：

标签： extjs

【解决方案1】：

解决办法是：

context.doLayout();

感谢这个平行的问题：How to refresh a panel after data is loaded?

【讨论】：

您好 NOtherDev，您的回答是正确的，它适用于 Firefox、Chrome 或任何其他设备，但不适用于 IE。你能告诉我如何在IE中解决它。