ExtJs - Set a fixed width in a center layout in a Panel

Posted by Benjamin on Stack Overflow See other posts from Stack Overflow or by Benjamin
Published on 2010-03-11T05:08:43Z Indexed on 2010/03/11 5:13 UTC
Read the original article Hit count: 824

Filed under:
|
|
|
|

Hi all,

Using ExtJs.

I'm trying to design a main which is divided into three sub panels (a tree list, a grid and a panel). The way it works is that you have a tree list (west) with elements, you click on an element which populates the grid (center), then you click on an element in the grid and that generates the panel (west).

My main panel containing the three other ones has been defined with a layout 'border'.

Now the problem I face is that the center layout (the grid) has been defined in the code with a fixed width and the west panel as an auto width. But when the interface gets generated, the grid width is suddenly taking all the space in the interface instead of the west panel.

The code looks like that:

var exploits_details_panel = new Ext.Panel({ region: 'east', autoWidth: true, autoScroll: true, html: 'test' });

var exploit_commands = new Ext.grid.GridPanel({ store: new Ext.data.Store({ autoDestroy: true }),

sortable: true,
autoWidth: false,
region: 'center',
stripeRows: true,
autoScroll: true,
border: true,
width: 225,

columns: [
 {header: 'command', width: 150, sortable: true},
 {header: 'date', width: 70, sortable: true}
]

});

var exploits_tree = new Ext.tree.TreePanel({ border: true, region: 'west', width: 200, useArrows: true, autoScroll: true, animate: true, containerScroll: true, rootVisible: false, root: {nodeType: 'async'}, dataUrl: '/ui/modules/select/exploits/tree',

listeners: {
 'click': function(node) {
 }
}

});

var exploits = new Ext.Panel({ id: 'beef-configuration-exploits', title: 'Auto-Exploit', region: 'center', split: true, autoScroll: true, layout: { type: 'border', padding: '5', align: 'left' },

items: [exploits_tree, exploit_commands, exploits_details_panel]

});

Here 'var exploits' is my main panel containing the three other sub panels.

The 'exploits_tree' is the tree list containing some elements. When you click on one of the elements the grid 'exploit_commands' gets populated and when you click in one of the populated elements, the 'exploits_details_panel' panel gets generated.

How can I set a fixed width on 'exploit_commands'?

Thanks for your time.

© Stack Overflow or respective owner

Related posts about extjs

Related posts about layout