View Full Version : Local memory paging with a grid - MemoryProxy - Need Help

25 Dec 2011, 9:22 PM

I'm trying to add pagination to a grid. I have all the data from the server stored locally in a ListStore but I'm having trouble setting up the PagingToolBar. It is probably a simple solution but I can't find any examples using Ext GWT 3.X local (not RPC) ListStores and paginations. Here's what I have:

// data_store = new ListStore<Person>...
MemoryProxy<PagingLoadConfig, PagingLoadResult<Person>> proxy = new MemoryProxy<PagingLoadConfig, PagingLoadResult<Person>>(data_store);
PagingLoader<PagingLoadConfig, PagingLoadResult<Person>> loader = new PagingLoader<PagingLoadConfig, PagingLoadResult<Person>>(proxy);
final PagingToolBar pagingToolBar = new PagingToolBar(30);
pagingToolBar.getElement().getStyle().setProperty("borderBottom", "none");

Thanks in advance.

Colin Alworth
4 Jan 2012, 9:45 AM
The basic problem you will have with the MemoryProxy is that it always returns the same data. Try subclassing MemoryProxy and overriding load so it returns the subset of the list you want. Here is a quick (untested) example of how this might look

public class MyPagingMemoryProxy extends MemoryProxy<PagingLoadConfig, PagingLoadResult<Person>> {
private final List<Person> totalList;
public MyPagingMemoryProxy(List<Person> totalList) {
super(null);//data is useless in this case, memoryProxy only designed to hold, not to search
this.totalList = totalList;
public void load(PagingLoadConfig config, Callback<PagingLoadResult<Person>, Throwable> callback) {
List<Person> results = totalList.subList(...);// Get results list based on the data the proxy was created with

callback.onSuccess(new PagingLoadResultBean<Person>(results, ...));// again, data from the config

You may want to add a call to onFailure if the config didn't make sense.

26 Mar 2013, 11:10 AM
Thanks for the input regarding the MemeoryProxy. Especially the detail "data is useless in this case, memoryProxy only designed to hold, not to search"

2 Feb 2015, 4:42 AM
In Process of sencha lib upgrade we have migrated from Sencha GXT 2.x to 3.0. We manage to load Grid Data using local memory proxy as shown using above example of sublist, but now when user clicks on columnheader, data are only being sorted for that individual page.

we want to sort full store data then display that full store data to user GUI, in above case its sorting only for that page cache data.

do we have any workaround or jst limitation of sencha gxt 3.0?

can someone help ?

Colin Alworth
2 Feb 2015, 10:54 AM
Its not a limitation, it is doing exactly what you are asking it to do. Right now, you are doing *local* sorts and filters, but you need to set them up to be *remote*. If there are 10,000 items, but only 100 are local, and you attempt to sort locally, you won't get the top 100 items over the whole 10,000, but will instead only get those existing 100 items sorted amongst themselves. As you point out, this really isn't what you wanted.

Now, in your case, 'remote' means 'in the proxy', since you aren't actually going back to the server for any requests. In the same proxy where you do subList to get the right page, you must sort (and perhaps filter) the big list *before* you take that subList.

2 Feb 2015, 10:45 PM
Hi colin,

Thanks for quick response. as you said before I do sublist I need to sort the full store. now other challange in this case is there are multiple columns on Grid and in this case we will not be able to capture for which grid column field we need to apply sorting logic.

For example : there are stockId (Integer), stock name (String), Stock Date(Date) etc.

When user click on stockId we need to sort on stockId field where as when user click on "Stock Date" we need to sort on stock date field.

I was wondering how was it handled in sencha 2.x ?

by chance do you have any other approach ?

Colin Alworth
3 Feb 2015, 6:55 AM
I'm not sure why you can't capture which column you want to sort - isnt it in the load config data for you to read it out? to be fair, it will just be a string, but you can either build logic to check which string and sort accordingly, or give your proxy a list of all reasonable value providers for that type and read their .getPath() to see if it matches the column name in the load config. This is essentially the same as you would have done on the server for a 'real' proxy.

As far as GXT 2, you had to use BaseModelData which was backed by a Map<String, Object>, which a) limited your options for talking to the server, but b) gave you something resembling reflection. The ValueProviders in GXT 3 serve the same reflection purpose, but without making you use a specific base class for your data, and compile out better too in many cases.

3 Feb 2015, 10:15 PM
Hi Colin,

thanks for reply,

I'm not talking about initial sort when data gets loaded into grid, here in my case user click on grid column header (which we defined as ColumnConfig) and we want to sort that.

I don't see any option of capturing event on ColumnConfig, if user click on column I could have apply some comparator on onClick Event.

Below is my sample "load" method:

If you can point out of your .getPath() approach or how to capture which column clicked?

public void load(PagingLoadConfig loadConfig, Callback<PagingLoadResult<M>, Throwable> callback) {
// Get results list based on the data the proxy was created with
int limit = loadConfig.getOffset() + loadConfig.getLimit();
if (totalList.isEmpty()) {
limit = 0;
} else if (limit >= totalList.size()) {
limit = totalList.size();

List<M> results = totalList.subList(loadConfig.getOffset(), limit);
PagingLoadResultBean<M> bean = new PagingLoadResultBean<M>(results, totalList.size(), loadConfig.getOffset());