PDA

View Full Version : TreeGrid + Filter Field not expanding results



bboyle18
20 Aug 2009, 5:07 PM
Hi,

I have created a TreeGrid with a filter field.
When I type some text to filter, the contents of the TreeGrid are filtered, however the child elements of the tree are not expanded. I expected this to work in the same way as the Filter Tree demo http://extjs.com/examples/explorer.html#filtertree where the text that I am searching for is expanded.

From what I can see from the code, TreeGrid has a slightly different onFilter() implementation to TreePanel.
Anyone got any ideas how I can get the same functionality as the Filter Tree demo?

My app is here for anyone who wants to see how its currently (not) working.
http://swift-tree.appspot.com

Thanks

Brian

Arno.Nyhm
21 Aug 2009, 2:50 AM
i remember its important how and to which store you add it.
can you give us the code of your example?

bboyle18
21 Aug 2009, 11:19 AM
Hi,

Below is my code. All of it is contained within for onModuleLoad() for now.

Thanks,
Brian



public void onModuleLoad(){
setLayout(new FlowLayout(10));

TreeLoader<ModelData> loader = new BaseTreeLoader<ModelData>(
new TreeModelReader<List<ModelData>>());

Folder model = TestData.getTreeModel();
loader.load(model);

TreeStore<ModelData> store = new TreeStore<ModelData>(loader);
store.add(model.getChildren(), true);


ColumnConfig name = new ColumnConfig("name", "Name", 100);
name.setRenderer(new TreeGridCellRenderer<ModelData>());

ColumnConfig date = new ColumnConfig("author", "Author", 100);

ColumnConfig size = new ColumnConfig("genre", "Genre", 100);

ColumnModel cm = new ColumnModel(Arrays.asList(name, date, size));

VerticalPanel panel = new VerticalPanel();
panel.addStyleName("x-small-editor");
panel.setSpacing(8);

TreeGrid<ModelData> tree = new TreeGrid<ModelData>(store, cm);
tree.setBorders(true);
tree.setSize(600, 400);
tree.setStripeRows(true);
tree.setAutoExpandColumn("name");
tree.setTrackMouseOver(false);
tree.setStateful(true);

StoreFilterField<ModelData> filter = new StoreFilterField<ModelData>() {
@Override
protected boolean doSelect(Store<ModelData> store,
ModelData parent, ModelData record, String property,
String filter) {
// only match leaf nodes
if (record instanceof Folder) {
return false;
}
String name = record.get("name");
name = name.toLowerCase();
if (name.startsWith(filter.toLowerCase())) {
return true;
}
return false;
}

};
filter.bind(store);
panel.add(new Image("/images/swift.jpg"));
panel.add(new Html("<span class=text>Enter a search string such as 'vio' or 'b'</span>"));
panel.add(filter);
panel.add(tree);

Viewport viewport = new Viewport();
viewport.add(panel);
RootPanel.get().add(viewport);

}

Arno.Nyhm
24 Aug 2009, 12:54 AM
i see it is not working.
i miss also the TreePanel#setExpandOnFilter in treegrid.

bboyle18
24 Aug 2009, 1:12 AM
Thanks for getting back to me.
So you think it's not possible to do this on a treegrid since setExpandOnFilter() is unavailable?

Thanks
Brian

Rakes H
7 Sep 2009, 8:54 AM
Hi,

I am also facing a similar issue, Is the issue got fixed with any latest releases?

sven
7 Sep 2009, 9:00 AM
Why is this an issue that should be fixed in GXT? It is a custom behaviour you want to implement. This isnt very hard to do.

Rakes H
8 Sep 2009, 12:42 AM
Hi Sven,

Thanks for the reply.

My understanding after reading the forum was, the issue happened because the TreeGrid is missing the method setExpandedonFilter which is there with TreePanel.

In my case I am getting the TreeGrid populated through async mehtod call. The code is similar to what bboyle18 has posted, the difference being, I use RPC call, and load the tree grid asynchronously.

In the filter whenever I type in few letters, I can see it goes to the doSelect method, I have overridden, which correctly return the Boolean value.

But always the result shows the root node.

Do you have any clue on this issue?

Do you have any examples with async treegrid with filtering?

ikis
7 Jan 2010, 11:44 AM
Hi,

I have solved this problem with overriding onfilter() method of TreeGrid class.
Create a class which is extended from TreeGrid Class.


public class IkisTreeGrid......... extends TreeGrid{

.................
.........fill your code if there is.........
.................

protected void onFilter(TreeStoreEvent<T> se){
super.onFilter(se);
this.setExpanded(this.getStore().getAt(0), true, true);
}
}

aconn7
18 Jan 2010, 10:20 AM
This may not work in every case, but was an easy fix to provide this behavior in my async/filtered TreePanel:


tree.addListener(Events.BeforeExpand , new Listener<TreePanelEvent<BaseTreeModel>>(){
public void handleEvent(TreePanelEvent<BaseTreeModel> be) {
store.removeAll(be.getItem());
loader.loadChildren(be.getItem());
}
});

harun
18 Feb 2010, 7:39 AM
Hi,

I have solved this problem with overriding onfilter() method of TreeGrid class.
Create a class which is extended from TreeGrid Class.


public class IkisTreeGrid......... extends TreeGrid{

.................
.........fill your code if there is.........
.................

protected void onFilter(TreeStoreEvent<T> se){
super.onFilter(se);
this.setExpanded(this.getStore().getAt(0), true, true);
}
}


hi ikis

I try to do your solution but failed.Please can you help me?
How can I use this IkisTreeGrid class? Am I extend this class where my storefilterfield is exist?But I couldn't do this.I'm junior ,please can you show me sample code please.I'm waiting your replay

ikis
19 Feb 2010, 1:06 AM
No, I think It is not necessary.

IkisTreeGrid is my class which extended from TreeGrid.

onFilter method is an overrided method which is defined in TreeGrid and it is called when TreeGrid is filtered.

1. Please let me know if your onfilter method is run when you insert some text in storefilterfield. For ex: is system.out... works in onfilter?

2. Beware! this code work for trees which are only have one root node. If you have more than one root node you should call "this.setExpanded(this.getStore().getAt(0), true, true)"method in a for loop.

harun
26 Feb 2010, 4:27 AM
Thank you very much Ikis,

your solution is working, it is wonderful

http://img211.imageshack.us/img211/1718/bilgisayar.gif