窗口中的ExtJS 4网格面板令人烦恼的水平滚动条

时间:2016-11-09 02:41:57

标签: css extjs extjs4.2

我在这样的窗口中创建一个网格:

Ext.create('Ext.data.Store', {
    storeId:'simpsonsStore',
    fields:['name', 'email',],
    data:{'items':[
        { 'name': 'Lisa',  "email":"lisa@simpsons.com"  },
        { 'name': 'Bart',  "email":"bart@simpsons.com" },
        { 'name': 'Homer', "email":"home@simpsons.com"  },
        { 'name': 'Marge', "email":"marge@simpsons.com"  }
    ]},
    proxy: {
        type: 'memory',
        reader: {
            type: 'json',
            root: 'items'
        }
    }
});

Ext.create("Ext.window.Window", {
title: 'BlaBla',
closable: true,
modal: true,
width: 800,
height: 460,
layout: 'fit',
items: [
    {
        xtype: 'gridpanel',
        autoScroll: true,
        store: Ext.data.StoreManager.lookup('simpsonsStore'),
        title: 'Choose which features you would like to use to create parts.',
        // height: 300,
        columns: {
            items: [
                {
                    header: 'Name',
                    tooltip: 'Name',
                    dataIndex: 'name',
                    flex: 1
                }, 
                {
                    header: 'Email',
                    tooltip: 'Email',
                    dataIndex: 'email',
                    flex: 1
                }
            ]
        }
    },

]
}).show();

生成这样的窗口: window with grid

但是,网格面板有一个烦人的水平滚动条,因为列很合适所以没有必要。

为什么要创建滚动条,我应该使用什么?

2 个答案:

答案 0 :(得分:1)

由于窗口的宽度和高度而创建此滚动条,而不是因为网格。你请调整窗口的宽度,你会得到欲望的结果。我改变了窗口width并完美地来了。这是您的fiddle

答案 1 :(得分:0)

不要指定身高和身高。宽度到窗口,将其提供给您的网格面板。 因为这个窗口得到自动高度&宽度,完全取决于网格。 ;)