Tree and borderlayout - Ext JS

Hi all,

First off all, yui-ext is a real good library. I was looking for a long time for a lib like this.

The last 4 days i was experimenting with this library but i get stuck at some point.
My question is about the treeview and the borderlayout option. So i was browsing the forums to find a solution but no luck. It is about the TreePanel

I can add a grid panel to the region
layout.add('center', new Ext.GridPanel(theGrid, {title: 'Properties', .....}));
but if i try this with a treePanel i get an error.
layout.add('center', new Ext.tree.TreePanel(theTree, {title: 'Properties', ......}));

Is this allowed or not ?

Because when i create a tree with the id form a div the tree will be succesfully created.

Any suggestions to get the same results as the gridpanel

Mike

#2   03-15-2007, 09:05 AM

I'm not sure if this is the right way of doing it but I did the following: <div id="treeContainer"> <div id="tree"></tree> </div> Then... var tree = new Ext.tree.TreePanel('tree', {...}); ...and... layout.add('west', new Ext.ContentPanel('treeContainer', {...}));

#3   03-16-2007, 06:49 AM

IE Bug with scrollbars? Thanks KimH, i know i could be done that way i also did this but it does not gives me the right results. The vertical scrollbars of my tree will disappear if the content is longer than the actual screen. Also the horizontal scrollbar will not show up. I have done some test's and it seems the problem appears in IE and not in FF. See the following screendumps of both browsers (btw i use IE 7.0 and FF 2.0.0.2) This is the firefox screendump, everything seems OK This is the IE screendump, as you can see the scrollbar will disappear when the content i getting to long to fit. The horizontal scrollbar will never not show up. This does not apply to tree only also written text that is too long will hide the scrollbar and also the horizontal scrollbar will not show up. To see my code http://www.ly2.nl/newGUI/index.html Does anyone have a sollution/suggestion

#4   03-16-2007, 07:01 AM

A TreePanel doesn't require a custom panel type to add it to a BorderLayout. That means you can do: var tree = new Ext.tree.TreePanel('tree-div-id', {...}); and var cp = new Ext.ContentPanel('tree-div-id', {autoScroll:true, fitToFrame:true}); The names are misleading. A TreePanel is really just a Tree widget, not a BorderLayout Panel. fitToFrame will fix your scroll issue.

#5   03-16-2007, 07:23 AM

Aahh It works perfect, was it just that simple. Thanks