ExtJs 4網格面板在調整窗口大小時無法正確調整大小

Question

我在DIV中渲染網格面板，對於DIV和網格面板，我都沒有指定任何寬度，因此它應該占用瀏覽器的所有可用寬度。 當用戶調整瀏覽器窗口大小時，此網格不會根據瀏覽器的新寬度自行調整大小。 我已經嘗試過在以下鏈接中找到的建議/解決方案，但是這些對我不起作用

Stackoverflow帖子 -從此我嘗試了調整窗口大小的解決方案

ExtJs插件-適合父級 -我也將此ExtJs 3插件移植到ExtJs 4，但這也沒有幫助

任何指針或幫助都受到高度贊賞

這是我的項目的Grip面板的代碼片段

    Ext4.define('myNameSpace.myGrid', {
    extend: 'Ext4.grid.Panel',
    alias: ['widget.myGrid'],
    constructor: function (config) {
        config = Ext4.apply({}, config || {}, {
            columnLines: true,
            sortableColumns: false,
            enableColumnHide: false,
            enableColumnMove: false,
            enableColumnResize: false,
            forceFit: false,
            viewConfig: {
                enableTextSelection: true,
                stripeRows: false,
                loadMask: false,
                emptyText: '<div class="x-grid-empty"> NO Data present</div>',
                deferEmptyText: true,
                getRowClass: function(record, rowIndex, rowParams, store){
                    return record.data.isExpired ? "expired-transaction" : '';
                }
            },
            columns: {
                defaults: { 
                    height: 30  
                },
                items: [
                    {
                        text: "&#160;",
                        id: "recurringColumnHdr",
                        width: 30,
                        dataIndex: "isRecurring",

                        align: "center"
                    },
                    {
                        text: "From",
                        id: "fromColumnHdr",
                        width: 175,
                        flex: .15,
                        dataIndex: "fromAccountDescription"
                    },
                    {
                        text: "To",
                        id: "toColumnHdr",
                        width: 175,
                        flex: .15,
                        dataIndex: "toAccountDescription"
                    },
                    {
                        text: "Amount",
                        id: "amountColumnHdr",
                        width: 100,
                        dataIndex: "amount",
                        renderer: Ext4.util.Format.usMoney,
                        align: 'right'
                    },
                    {
                        text: "Date",
                        id: "dateColumnHdr",
                        width: 75,
                        dataIndex: "transferDate",
                        align: 'right'

                    },
                    {
                        text: "Repeat",
                        id: "repeatColumnHdr",
                        dataIndex: "frequency",
                        flex:.35,

                    },
                    {
                        text: "Memo",
                        dataIndex: "memo",
                        id: "memoColumnHdr",
                        flex: .35
                    }
                ]
            },
            dockedItems: [{
                xtype: 'toolbar',
                dock: 'bottom',
                height: 30
            }]
        });
        this.callParent([config]);



    }
});

這是我用來在網格上方渲染的代碼

 Ext4.create('myNameSpace.myGrid', {
            store: Ext4.create('myGridStore'),
            renderTo: 'transfersGrid',
            id: "transferGridPanel"
        });

Answer 1

在網格配置中使用minWidth，maxWidth，minHeight和maxHeight屬性

Answer 2

已解決此問題，其他周圍的HTML出現了問題，而不是網格出現了問題