ExtJS: datagrid: re-apply sorting / refresh after loading

Question

I've been looking for it for such a long time, and (from my own point of view) this is a basic behavior that should've been done a long time ago: you sort a grid by a column, say "NAME", you modify a record, the name "AAA" becomes "ZZZ", it's sent to the server, the server answers "ok" with "ZZZ" so the value is updated but stays at the same place, i.e. the sort order is not refreshed.

Is there a way to do this automatically? Which event, which code? How?

Answer 1

I've asked on the Sencha's forum and for the first time in history I've got the answer there before on stackoverflow. So, to share the answer, here's my code that works:

Ext.define('Ext.data.StoreHandleErrors', {
    extend: 'Ext.data.Store',
    alias: 'data.storehandleerrors',

    constructor: function(config) {
        this.callParent([config]);

        this.on(
            'write',
            function(me, opts) {
                this.sort();
            },
            this
        );
    }
});

Explanation: I'm overriding the constructor so that each time the "write" event is called i.e. each time the record is sent to the server, this re-sort the store so that we are always sure it's properly refreshed. This is a generic method that may be "too much" (= no need to re-sort again for each write) but (1) it works for all stores (2) no need to make custom hard-coded stuff like Abdel suggested (although Abdel's answer may be more suitable to make it only once in a specific piece of code).