Extjs grid宽度自适应

最新推荐文章于 2018-06-21 12:18:30 发布

原创最新推荐文章于 2018-06-21 12:18:30 发布 · 1k 阅读

0 ·

本内容遵循CC 4.0 BY-SA版权协议

标签

#EXT

收录于

Ext 专栏收录该内容

20 篇文章

订阅专栏

本文介绍了一种使用ExtJS框架创建网格面板的方法。通过设置div元素的宽度，并利用ExtJS的GridPanel组件实现数据展示。文章提供了两种设置宽度的方式：一是直接通过div元素的宽度属性，二是将body样式设为宽度100%，以适应不同场景的需求。

第一种方法必须在页面上设置div的宽度<div id="grid-example" width="90%"></div>

    // create the Grid
    var grid = new Ext.grid.GridPanel({
        store: store,
        columns: [
            {id:'company',header: 'Company', width: 160, sortable: true, dataIndex: 'company'}
         ],
        stripeRows: true,
        autoExpandColumn: 'company',
        height: 350,
        //第一种方法：width: Ext.get("grid-example").getWidth(),
        //第二种方法
     bodyStyle:'width:100%', 
        title: 'Array Grid',
        // config options for stateful behavior
        stateful: true,
        stateId: 'grid'        
    });