3

在 ExtJS 3 中，如何将网格设置为自动宽度？我试过下面的代码，它不起作用。

谢谢

var exceptionGrid = new Ext.grid.GridPanel({
    store: exceptionStore,
    loadMask: true,
    frame: true,
    // defaultWidth: 450,
    //height: 560,
    autoHeight: true,
    autoWidth: true,
    colModel: new Ext.grid.ColumnModel({
        defaults: {
            width: 120,
            sortable: true
        },
        columns: [{
            header: 'COL1',
            dataIndex: 'COL1'
        }, {
            header: 'COL2',
            dataIndex: 'COL2'
        }, {
            header: 'COL3',
            dataIndex: 'COL3'
        }, .....]
    }),
    viewConfig: {
        forceFit: false
    }
});
4

2 回答 2

3

来自 extjs 3 文档：

网格面板

Notes:

 - Although this class inherits many configuration options from base
   classes, some of them (such as autoScroll, autoWidth, layout, items,
   etc) are not used by this class, and will have no effect.

 - A grid requires a width in which to scroll its columns, and a height
   in which to scroll its rows. These dimensions can either be set
   explicitly through the height and width configuration options or
   implicitly set by using the grid as a child item of a Container which
   will have a layout manager provide the sizing of its child items (for
   example the Container of the Grid may specify layout:'fit').

如果未指定，默认情况下网格的宽度当然采用容器宽度。Ext.grid.GridPanel# autoExpandColumn将有助于扩展网格中的一列，占用剩余的水平空间。也将有助于查看 Ext.grid.GridView 的forceFit和autoFill调整列的宽度。

于 2012-07-07T00:27:08.577 回答
0

根据您的设计，有多种方法可以做到这一点

1.尝试虽然\有时会产生问题width: '100%'，但宽度总是可以正常工作。autoHeight:trueautoHeight:trueheight: '100%'

2.如果您的网格是 iframe/网页的“唯一”部分，请使用以下代码

   var viewport=new Ext.Viewport({
       layout: 'fit',
            monitorResize : true,
            items: [exceptionGrid ]
    })

3.如果问题只是滚动条，然后使用

    viewConfig: {
        forceFit: true
    }

4.您始终可以设置width: window.screen.width - 20（根据您的需要应用一些数学来制作它）和类似的高度。

于 2014-02-11T11:55:40.950 回答