Hiding unwanted scrollbars on TreePanel (GXT-2.2.5)

[rankinc]

Hi,

I have embedded a TreePanel inside a ContentPanel, and have configured the ContentPanel to have AUTOX scroll behaviour. However, whenever the TreePanel content overflows, I am getting scrollbars on the TreePanel as well as the ContentPanel!

Digging into the HTML, I have discovered that this is because GXT has set an explicit 'style' attribute on the TreePanel's <div>, namely style: 'display: block; overflow-x: auto; overflow-y: auto;'. Removing these "overflow" styles gives me the behaviour that I want.

My code looks like this:

TreeStore<Model> store = new TreeStore<Model>(loader);
final TreePanel<Model> treePanel = new TreePanel<Model>(store);
treePanel.setDeferHeight(true);
treePanel.setAutoLoad(true);

...

StoreFilterField<Model> filter = new StoreFilterField<Model>() {
@Override
protected boolean doSelect(Store<Model> store, Model parent, Model record, String property, String filter) {
return ... // filter condition
}
};

filter.setAutoWidth(true);
filter.bind(store);

final ContentPanel panel = new ContentPanel(new RowLayout(Orientation.VERTICAL));
panel.setScrollMode(Style.Scroll.AUTOX);
panel.setBorders(true);

....

panel.add(filter, new RowData(1, -1, new Margins(1)));
panel.add(treePanel, new RowData(-1, 1));

Viewport viewport = new Viewport();
viewport.setLayout(new FitLayout());
viewport.add(panel);

RootPanel.get("myid").add(viewport);

My current strategy is to override these unwanted "overflow" styles using CSS, except that inline styles have extremely high precedence and the "div[style]" trick doesn't work in all browsers (stupid ****ing IE). Obviously, it would be better if GXT didn't set the "overflow" styles in the first place. Is there any way to tell TreePanel not to do this, please? I can't find any obvious way of controlling TreePanel's scroll behaviour programatically.

Thanks,
Chris

[WesleyMoy]

You can access the element for a widget (both Ext GWT components and plain GWT widgets) by calling getElement() on that widget. Once you have the element, you can use getStyle() to get its style attribute (as a Style object) and modify it in whatever way you see fit. In your case, you may be able to simply clear the overflow properties.