How to iterate over a string after store.load ()

Question

I have a grid panel and a button.
When I click the button, it will transfer data through ajax and after complete the grid.
I am trying to iterate over the selected line (here I give an example, this is the first line), but in any case it does not work

Ext.Ajax.request({ url: ..., params: { v: ... }, success: function(response){ grid.store.load(); grid.getSelectionModel().select(0, true); // example first row } }) 

Answer 1

try selecting a line in the callback

 grid.store.load({ scope:this, callback:function(records, operation, success){ grid.getSelectionModel().select(0, true); } }); 

or

 grid.store.load(function(records, operation, success){ grid.getSelectionModel().select(0, true); }); 

Answer 2

You can make row selections survive in store reloads by applying the following overrides:

 Ext.override(Ext.view.View, { preserveSelectionOnRefresh: true, constructor: function() { this.callOverridden(arguments); if (this.preserveSelectionOnRefresh) { this.mon(this.getStore(), { beforeload: this.beforeStoreLoadPreserveSelectionRoutine, scope: this }); } }, beforeStoreLoadPreserveSelectionRoutine: function() { var sm = this.getSelectionModel(), selection = sm.getSelection(), i = 0, l = selection.length, savedSelection = []; delete sm.savedSelection; for (; i < l; i++) { savedSelection.push(selection[i].getId()); } if (savedSelection.length) { sm.savedSelection = savedSelection; } } }); Ext.override(Ext.selection.Model, { refresh: function() { // include selections saved across store reloads if (this.savedSelection && this.savedSelection.length) { var rs = [], r, j = 0, l = this.savedSelection.length; for (; j < l; j++) { r = this.store.getById(this.savedSelection[j]); if (r) { rs.push(r); } } if (rs.length) { this.select(rs, false, true); } } this.callOverridden(); delete this.savedSelection; } }); 

What they do is simply save what was selected before the store reboot, and ensure that these records are re-fetched after the presentation is updated. Tested on Ext JS 4.1.2.

Answer 3

... and if you use buffered storage and Ext JS 4.2+, you can use the scrollTo function, which selects AND, scrolls the view to your choice:

 grid.store.load(function(records, operation, success){ grid.view.bufferedRenderer.scrollTo(0, true); }); 

Answer 4

select the line after loading the repository by adding a callback:

 grid.store.load(function(records, operation, success) { grid.getView().select(0); }); 

Answer 5

grid.store.load ==> grid.store.on

http://bit.ly/1iBwb2i

Answer 6

In response, perhaps you can use the field to differentiate it:

Sencha 4.0.7: finde store

 store.find(fieldName, value); 

Another way, but I think this does not work after loading, it uses:

Sencha: getLastSelected

 grid.getSelectionModel().getLastSelected() 

Answer 7

Here is a plugin that will take care of this for you:

https://github.com/roberto-rodriguez/ExtJs_GridMultipageSelectionPlugin

The plugin supports the choice between pages in the pagination grid. It also includes a function called: getSelection () in the grid, which returns an array with the identifiers of the selected rows.

The plugin assumes a column with dataIndex: 'id'

Answer 8

If you want to select everything that was selected last (and not just the first line, as shown in the accepted answer), this is the easiest, I think:

 grid.store.load(function() { var view = grid.getView(), selModel = grid.getSelectionModel(), lastSelected = selModel.getLastSelected(); view.select(lastSelected); }); 

or better, a listener for the entire download made by the repository in the future:

 grid.store.on('load', function() { var view = grid.getView(), selModel = grid.getSelectionModel(), lastSelected = selModel.getLastSelected(); view.select(lastSelected); }); grid.store.load();