Javascript 如何适应网格面板列？

我有一个使用ExtJS3.4的应用程序。
我有这样的结构：

西面板选项卡面板：

var westPanel = new Ext.TabPanel({
            id: "west",
            //xtype: "tabpanel",
            //layout:'fit',
            activeTab: 0,
            region: "west",
            border: false,
            width: 278,
            split: true,
            collapseMode: "mini",
            items: [mapList,structure,cadastr,search]
        });

搜索-表单面板：

var search = new Ext.FormPanel({
                labelAlign: 'top',
                frame:true,
                title: 'Поиск',
                bodyStyle:'padding:5px 5px 0',
                //width: 600,
                //layout:'fit',
                items: [{
                    xtype:'textfield',
                    fieldLabel: 'Диспечерское наименование',
                    name: 'name_dispather',
                    anchor:'100%',
                    enableKeyEvents: true,
                    listeners: {
                        'keyup': function(e) {
                            if(e.getValue().length==4){
                                searchStore.load({params:{'name':e.getValue()}});
                            }
                        }
                    }
                },searchTab]
            });

搜索选项卡-网格面板：

var searchTab = new Ext.ux.grid.livegrid.GridPanel({
    store: searchStore,
    region: 'center',
    cm: searchCm, 
    layout: 'fit',
    selModel: new Ext.ux.grid.livegrid.RowSelectionModel(),
    stripeRows : true,
    view: myView,
    height: 390,
    loadMask: true,
    id: 'searchTab',
    title:'Найденные объекты',
    autoScroll: true,
});

我有一个问题：

必须使最后一列的宽度达到整个面板的宽度吗

更新

我尝试自动扩展列。它的作品，但它不是唯一的：

---

如何修复它？

您可以通过

flex

config来实现这一点

您只能在一列上执行此操作：

columns: [{text: "Column A", dataIndex: "field_A", flex: 1}]

或者，您可以在所有列上作为默认值执行此操作：

columns: {
    items: [
        {
            text: "Column A"
            dataIndex: "field_A"
        },{
            text: "Column B",
            dataIndex: "field_B"
        }, 
        ...
    ],
    defaults: {
        flex: 1
    }
}

尝试：

autoExpandColumn:

String

此网格中应展开以填充未使用空间的列的id

您必须为searchTab（我指的是网格面板）提供此配置选项

编辑：

  viewConfig:{
      scrollOffset: 0,
  forceFit: true
  },

---

这将消除滚动条留下的间隙。您需要在searchTab（我指的是网格面板）中提到这一点。

+1对于默认值，我不会使用它，因为您很可能会有包含宽度的列，我认为flex会覆盖宽度。flex应该只设置为那些打算自动展开的列。我认为大多数情况下并非如此。

@JohanHaest

Flex确实覆盖了指定的任何宽度

@seba

是的，我想我应该和大家分享：）。@A1rPun:默认值不起作用。也许是因为我使用ExtJS3.4？我在sencha文档中找不到flex属性。它们不在文档中，因为[Doc Bug]。要使默认值起作用，您必须按其xtype添加项（我在3.4文档中也找不到默认值）used@vajrakumar：我尝试自动展开列。它可以工作，但有一个问题，比如om屏幕的更新问题。那个空间是给滚动条的，若记录更多，滚动条就会出现在那个地方。任何我们能让这个空间运转的方法。给点时间我会把它贴出来。@Kliver Max:我想上面的编辑解决了你的问题。如果你没有提出进一步的疑问，但不要忘记在找到解决方案后接受答案。它将帮助其他人在搜索时只引用已接受的答案。