How to reload data rows in GXT grid?

Question

Assuming that data retrieves from DataStore using RPCproxy, populate to grid using ListStore upon opening the page.

Then, there's a form to add an entity and after modification it will reflect the new list in GXT grid with the new added row.

How can reload the grid? I tried .reconfigure() method in Grid but didn't work.

Solution 1

grid.getStore().getLoader().load();

update:

First of all you must extract Grid before your Proxy, and the second thing is to change your RPC callback:

 
    public class PagingBeanModelGridExample extends LayoutContainer {  

    //put grid Class outside a method or declare it as a final on the begin of a method
    Grid grid = null;

    protected void onRender(Element parent, int index) {
        super.onRender(parent, index);

        RpcProxy> proxy = new RpcProxy>() {

            @Override
            public void load(Object loadConfig, final AsyncCallback> callback) {
                //modification here - look that callback is overriden not passed through!!
                service.getBeanPosts((PagingLoadConfig) loadConfig, new AsyncCallback>() {

                    public void onFailure(Throwable caught) {
                        callback.onFailure(caught);
                    }

                    public void onSuccess(PagingLoadResult result) {
                        callback.onSuccess(result);
                        //here you are reloading store
                        grid.getStore().getLoader().load();
                    }
                });
            }
        };

        // loader  
        final BasePagingLoader> loader = new BasePagingLoader>(proxy, new BeanModelReader());

        ListStore store = new ListStore(loader);
        List columns = new ArrayList();
        //...  
        ColumnModel cm = new ColumnModel(columns);

        grid = new Grid(store, cm);
        add(grid);

    }
} 

Solution 2

To display the new data to grid do you really need to reload the grid? You can create a new model object with the new data and add this to the ListStore.

Suppose you have a CommentModel which extends the BaseModel and a ListStore of Comment model commentStore.

final ListStore<Commentmodel> commentStore = new ListStore<Commentmodel>();

//now call a rpc to load all available comments and add this to the commentStore.
commentService.getAllComment(new AsyncCallback<List<Commentmodel>>() {

   @Override
   public void onFailure(Throwable caught) {
    lbError.setText("data loading failure");

   }

   @Override
   public void onSuccess(List<Commentmodel> result) {
    commentStore.add(result);

   }
  }); 

commentService is an AsyncService.

Now if a user post a comment, just create a new CommentModel object with the new data

CommentModel newData = new CommentModel('user name', 'message','date');

And add this to the commentStore.

commentStore.add(newData);

Hope this will serve you purpose.

But if you really need to reload the whole set of data, call the service again. In the onSuccess method first clear the commentStore then add result. Remember this is more more time consuming that the 1st approach.

Comments

[Lynard]

thanks kospiotr. either grid.reconfigure(store,cm) or grid.getStore().getLoader().load(); works but remember to call this inside success method of rpc call.(that what I'm missing of) :)

[Abderrazak BOUADMA]

it seems that there's an infinite loop by calling the onSuccess() because onSuccess() the grid.getStore().getLoader().load(); is called which recall onSuccess() recursively.

[Louis Huh]

new model probably gets some unpredictable values such as id, createdAt, updatedAt. unfortunately I gave up first approach.