ExtJS — How to load store data manually after ajax call?

Question

I rewrite my working Fiddle from ajax proxy type to memory. I'm trying to load memory store data manually:

// app/model/Employees.js file
Ext.define('Fiddle.model.Employees', {
    extend: 'Ext.data.Model',
    entityName: 'Employees',

    fields: [
        {
            name: 'profile_pic'
        },
        {
            type: 'int',
            name: 'age'
        },
        {
            type: 'string',
            name: 'last',
            mapping: 'name.last'
        },
        {
            type: 'string',
            name: 'first',
            mapping: 'name.first'

        },
        {
            type: 'string',
            name: 'email'
        }
    ],

    proxy: {
        type: 'memory',
        reader: {
            type: 'json',
            rootProperty: 'items',
            totalProperty: 'total',
            successProperty: ''
        }
    }
});

// app/store/Employees.js file
Ext.define('Fiddle.store.Employees', {
    extend: 'Ext.data.Store',
    pageSize: 30, // items per page
    alias: 'store.employees',
    model: 'Fiddle.model.Employees',
});

//app.js fule - launch() function
var store = Ext.create('Fiddle.store.Employees');
console.log(store);


Ext.Ajax.request({
    url: 'mates.json',
    success: function(resp) {
        var result = resp.responseText;
        console.log(result);
        // store.loadRawData(result);
        store.loadData(result);
        console.log(store);
        console.log(store.getAt(0));
    },
});

As result I have 3386 records in store, every symbol in my json file. And what I see in console as first record:

What I'm doing wrong?

And where I need to put proxy lines - in model or in store?

Answer 1

Did it in this way:

//in Grid panel js file
listeners: {
    afterrender: function(grid, evt) {

        var myStore = grid.getStore();

        Ext.Ajax.request({
            url: 'mates.json',
            success: function(resp) {
                var result = Ext.decode(resp.responseText);
                myStore.getProxy().data = result;
                myStore.load();
            },
        });

    }
}

In store autoLoad: true must be disabled. This way of loading instead of store.loadRawData(result); shows the correct number of records in the pagingtoolbar.