Extjs Gridpanel内部自动高度选项卡面板

我试图在tabpanel中获得一个gridpanel，以适当的高度显示。有问题的选项卡是

maincontentpanel3

。现在，宽度为100%，但高度似乎一直保持到面板填满，远远超过页面底部

即使autoscroll设置为auto，滚动条也不会出现。如果我给

GridPanel1

一个高度，那么除了（显然）高度之外，其他一切都正常工作

以下是简化的代码：

<ext:Viewport runat="server" Layout="FitLayout">
    <Items>
        <ext:Panel runat="server" ID="maincontentpanelwrapper" >
            <Items>
                <ext:TabPanel ID="maincontentpanel" runat="server" Layout="FitLayout">
                    <Items>
                        <ext:Panel runat="server" ID="maincontentpanel1" >
                        </ext:Panel>
                        <ext:Panel runat="server" ID="maincontentpanel2" >
                        </ext:Panel>
                        <ext:Panel runat="server" ID="maincontentpanel3" >
                            <Items>
                                <ext:GridPanel ID="GridPanel1"  AutoScroll="true" runat="server" >
                                    <Store>
                                        [REMOVED]
                                    </Store>
                                    <ColumnModel>
                                        <Columns>
                                            [REMOVED]
                                        </Columns>
                                    </ColumnModel>
                                </ext:GridPanel>
                            </Items>
                        </ext:Panel>
                    </Items>
                </ext:TabPanel>
            </Items>
        </ext:Panel>
    </Items>
</ext:Viewport>

[删除]
[删除]

这是右下角发生的事情的图像（没有滚动条，明显溢出）

---

谢谢你的帮助

我唯一能弄明白怎么做的方法就是使用javascript。这就是我提出的解决方案：

initialload2();
function initialload2() {
    if (Ext.getCmp("GridPanel1")) {
        if (window.innerHeight != undefined) {
            var height = window.innerHeight;
        }
        else {
            //for ie
            var B = document.body,
            D = document.documentElement;
            var height = Math.min(D.clientHeight, B.clientHeight);
        }
        Ext.getCmp("GridPanel1").setHeight(height - 62);
    } else {
        setTimeout(initialload2, 100);
    }
}

var resizeTimer;
window.onresize = function () {
    clearTimeout(resizeTimer);
    resizeTimer = setTimeout(initialload2, 100);
};

---

可以使用标记进行修复。无需使用javascript。 我已经在ext.NET2.0上进行了测试，我认为它也可以在旧版本上运行

只要在gridpanel和border中添加布局属性即可。 下面给出的例子

<ext:GridPanel ID="GridPanel1"  AutoScroll="true" runat="server" Layout="FitLayout" Border="true" >

---

就是这样。希望你喜欢它

如果你愿意，我可以用测试用例详细调查这个问题。