PDA

View Full Version : Paging toolbar: select first row



josei
9 Feb 2015, 3:48 AM
Hi!

The following method selects the first row of a grid by click a refresh button.
Works well.



onRefresh: function(grid, selected, record, eOpts){
var grid = Ext.ComponentQuery.query('#gridtemId')[0];
var store = grid.getStore();
grid.getSelectionModel().select(0);
}



What was intended that when change page in the paging toolbar (1 -> 2) was selected the first line of the grid of the new page (this selection fire an event in my app).


How can I do this?

Thanks in advance.

s.roux
11 Feb 2015, 7:13 AM
Hi josei,

You an use the change event of Ext.toolbar.Paging :
http://docs.sencha.com/extjs/5.1/5.1.0-apidocs/#!/api/Ext.toolbar.Paging-event-change

The toRecord parameter is the starting index of the current page.

It is only fired when the current page changes, so if you want to get it on a simple grid refresh you have to save it in a var.

josei
11 Feb 2015, 8:07 AM
Salut, roux.

Thanks for replying.

If I have understood correctly, the solution would be a change event fired, on listeners, at the grid?

Can you give me a hint how to do this in concrete, please.


I've tried, but without success.

Merci.

s.roux
11 Feb 2015, 8:19 AM
I don't find any method to get paging information directly.

So you can listen the 'change' event on the toolbar to get the record index, store it in a var, and then use it in your onRefresh method.

Hope it helps.

josei
11 Feb 2015, 8:49 AM
Hi!
What was intended that when change page in the paging toolbar (1 -> 2) was selected the first line of the grid of the new page (this selection fire an event in my app).
.

Thanks roux.

The problem is that I want the first row is automatically selected when changing pages in the paging toolbar.

I think that we first have to get the reference of the paging toolbar, which is not hard.

The difficulty lies in identify the specific event that is fired when page changes, or the page index when is changed.

Let's see if anyone in the community extjs or support team can give us more ideas to find the solution.

Thanks.

joel.watson
11 Feb 2015, 2:00 PM
Thanks roux.

The problem is that I want the first row is automatically selected when changing pages in the paging toolbar.

I think that we first have to get the reference of the paging toolbar, which is not hard.

The difficulty lies in identify the specific event that is fired when page changes, or the page index when is changed.

Let's see if anyone in the community extjs or support team can give us more ideas to find the solution.

Thanks.

Hi josei--

s.roux is suggestion to use the change event should work just fine. You can add listeners to your paging toolbar just like you would any other component.

I've included an example below.

Thanks!
Joel

i3m

josei
11 Feb 2015, 2:43 PM
Thanks, Joel.


Works well (in fact, as has always happened with your suggestions).=D>


I had tried before this solution, but did not work because I had the listeners in the grid and not in pagingtoolbar.

Thanks again.

joel.watson
11 Feb 2015, 2:46 PM
Thanks, Joel.

Works well (in fact, as has always happened with your suggestions).=D>

I had tried before this solution, but did not work because I had the listeners in the grid and not in pagingtoolbar.

Thanks again.

Sure thing! Glad it was helpful!

Thanks
Joel