PDA

View Full Version : Client side filtering a paginated grid (with Ext GWT)



tom69
26 Aug 2010, 4:57 AM
I want to filter (locally, ie client side) a paginated grid with Ext GWT. I have started with the Local paging example (http://www.sencha.com/examples/explorer.html#localpaging), added a StoreFilterField, and bounded the store to this StoreFilterField.
The grid is indeed filtered, but filtering is performed on each page, and not globally.
Am I missing something ?

tm-pbpolsoft
25 Sep 2010, 6:43 AM
I have exactly the same problem.

How can I achieve such feature with GXT?

sven
25 Sep 2010, 7:15 AM
You cannot.

Only the models that are displayed are within the store, so you can filter only on these. If you want to filter on all, you need to load all of them and put them into a PagingModelMemoryProxy for example. You will need to extend PagingModelMemoryProxy to add filtering support. The StoreFilterField wont work as it is doing local filtering.

tm-pbpolsoft
26 Sep 2010, 7:26 AM
Like I thought. Yeah, I finally did it this way - filtering is now passed to DataProxy. It works.

Now, I found problem with enabling typeAhead in this kind of ComboBox configuration. Am I forced, to implement once again typing ahead in DataProxy?

I wanted also to enable paging in SimpleComboBox, but I found no support there because of lack of loader/proxy. Or am I missing something? I have a SimpleComboBox with over 1000 elements and rendering list view in IE will make users a nightmare.

tm-pbpolsoft
27 Sep 2010, 3:00 AM
Ok, I implemented querying in DataProxy. There is a method ComboBox#getParams(String) which sets query into PageLoadConfig. Now, two things about it:

1. simply setting query in PageLoadConfig is quite useles, would be better setting it together with displayField (which I made myself)
2. when I query ComboBox, data gets filtered, but switching to next page clears filter

ad. 2. does setResuseLoadConfig(true) on loader fix the problem, or is it something different?

I wonder why is ComboBox#getParams(String) implemmented since there is no support for those params in PagingModelMemoryProxy?

always
18 Oct 2010, 8:06 AM
Hi,

I've got the same problem, but I'm so newie at GWT so, can you explain to me how you fixed it ?? I'll appreciate some examples.

Here is my code:


private Grid<Company> createGrid(List<Company> list) {

PagingModelMemoryProxy proxy = new PagingModelMemoryProxy(list);

final PagingLoader<PagingLoadResult<ModelData>> loader = new BasePagingLoader<PagingLoadResult<ModelData>>(proxy);
loader.setRemoteSort(true);

listStore = new ListStore<Company>(loader);

bottomToolBar = new PagingToolBar(10);
bottomToolBar.bind(loader);

loader.load(0, 10);


grid = new Grid<Company>(listStore, cm); /

cm.addHeaderGroup(0, 0, new HeaderGroupConfig(createFilter("companyCode"), 1, 1));
cm.addHeaderGroup(0, 1, new HeaderGroupConfig(createFilter("commercialName"), 1, 1));
cm.addHeaderGroup(0, 2, new HeaderGroupConfig(createFilter("shortSocialReason"), 1, 1));
cm.addHeaderGroup(0, 3, new HeaderGroupConfig(createFilter("wholeSocialReason"), 1, 1));
cm.addHeaderGroup(0, 4, new HeaderGroupConfig(countryCombo, 1, 1));

grid.getView().setForceFit(true);
grid.setStyleAttribute("borderTop", "none");
grid.setWidth("100");
grid.setAutoExpandColumn("comercialName");
grid.setBorders(false);
grid.setStripeRows(true);
grid.setColumnLines(true);
grid.setColumnReordering(true);
grid.setAutoHeight(true);


countryCombo.getView().addListener(Events.OnClick,
new Listener<ListViewEvent<BeanModel>>() {

@Override
public void handleEvent(ListViewEvent<BeanModel> be) {
Element target = be.getTarget();

if ("input".equalsIgnoreCase(target.getTagName())) {
filters = new StoreFilter<Company>() {

/* Determines if the given record should be selected.
* store - the source store
* parent - the parent item, only applies to TreeStores
* item - the item
* property - the active property
* return true to select, false to filter */
@Override
public boolean select(Store<Company> store,
Company parent, Company item, String property) {

boolean aux = false;
if(countryCombo.getSelection().size() == 0) return true;
else {

for(Country c : countryCombo.getSelection()) {

aux = aux || store.getRecord(item).get(property).equals(c.getName());


}
return aux;
}

}

};
// grid.getStore().getLoader().load(); // refresh the Grid Data (aunque no me funcione...)
grid.getStore().addFilter(filters);
grid.getStore().filter("country");

grid.getView().refresh(true);


}
}
});

// new QuickTip(grid);
return grid;

}

Any idea is welcome !

Thanks in advance.

sven
18 Oct 2010, 8:07 AM
http://www.sencha.com/forum/showthread.php?112851-Paging-Grid-with-filters

always
18 Oct 2010, 8:49 AM
hi, I've just read it, but, I don't know how to do it, I need some examples, thanks anyway.