grid.getView().getSelectionModel().getSelection(); not working

Question

I am working with ExtJS6.2 I have a simple Ext.grid.Panel with

this.selModel = Ext.create('Ext.selection.CheckboxModel', {
        checkOnly: true,
        injectCheckbox: 1
    });

I need the data from the grid in the same sequence like the data are shown in the grid.

If I select all items of the grid this works fine.

selection = grid.getView().getSelectionModel().getSelection();

Then I deselect one item in the grid - click the checkbox

Then the order of the selection is mixed up? How can I get the right order again?

Thanks in advance

Answer 1

You can achieve this behavior using the following override:

Ext.define('Ext.selection.ModelOverride', {
    override: 'Ext.selection.Model',
    syncSortSelectedWithStore: false,
    getSelection: function () {
        if (this.syncSortSelectedWithStore && this.view && !Ext.isEmpty(this.view.getStore())) {
            var map = this.view.getStore().getRange().reduce((acc, cur, i) => {
                acc[cur.id] = i;
                return acc;
            }, {})
            this.selected.sort(function (a, b) {
                return map[a.id] - map[b.id];
            })
        }
        return this.callParent(arguments);

    }
});

Also in my fiddle you can look at example and in the console I described how it all works in detail