Сетка ExtJs4 не отображает данные из ответа

Question

Я пытаюсь организовать сетку на основе ajax, используя ExtJs 4.2 от Sencha. Я определил модель данных и свой пользовательский компонент сетки, но, к сожалению, он не отображает принятые данные. Я не могу понять, почему:(

Код модели:

Ext.define('OperatedClient', {
    extend: 'Ext.data.Model',
    fields: [
        {name: 'id'},
        {name: 'first_name'},
        {name: 'second_name'},
        {name: 'surname'},
        {name: 'birthdate'},
        {name: 'diagnose'},
        {name: 'operation_date'},
        {name: 'operation'},
        {name: 'price'}
    ]
});

Код компонента моей сетки:

var defaultColumnRenderer = function(v) {
    return '<div style="text-align:right">' + v + '</div>';
};

Ext.define('Ext.custom.OperatedClientsGrid', {
    extend: 'Ext.grid.Panel',
    cls: 'custom-grid',
    columnLines: true,
    initComponent: function() {
        var opStore = Ext.create('Ext.data.Store', {
            autoLoad: true,
            model: 'OperatedClient',
            proxy: Ext.create('Ext.data.proxy.Ajax', {
                url: 'service/clients_op/read.php',
                reader: Ext.create('Ext.data.reader.Json', {
                    root: '$client_ops'
                })
            })
        });
        Ext.apply(this, {
            store: opStore
        },
        columns: [{
               text: 'Id',
               dataIndex: 'id',
               align: 'center',
               renderer: defaultColumnRenderer
           },{
                text: 'Имя',
                dataIndex: 'first_name',
                align: 'center',
                renderer: defaultColumnRenderer
           },{
                text: 'Отчество',
                dataIndex: 'second_name',
                align: 'center',
                renderer: defaultColumnRenderer
           },{
                text: 'Фамилия',
                dataIndex: 'surname',
                align: 'center',
                renderer: defaultColumnRenderer
           },{
               text: 'Дата рождения',
               dataIndex: 'birthdate',
               align: 'center',
               renderer: defaultColumnRenderer
           },{
               text: 'Диагноз',
               dataIndex: 'diagnose',
               align: 'center',
               renderer: defaultColumnRenderer
           },{
               text: 'Операция',
               dataIndex: 'operation',
               align: 'center',
               renderer: defaultColumnRenderer
           },{
               text: 'Дата операции',
               dataIndex: 'operation_date',
               align: 'center',
               renderer: defaultColumnRenderer
           },{
               text: 'Стоимость',
               dataIndex: 'price',
               align: 'center',
               renderer: defaultColumnRenderer
            }]
        });
        this.callParent();
    }
});

Код ответа сервера:

{"client_ops":[{"id":"1","first_name":"\u0410\u043d\u0434\u0440\u0435\u0439","second_name":"\u0418\u0432\u0430\u043d\u043e\u0432\u0438\u0447","surname":"\u0411\u043e\u043b\u044f\u0447\u043a\u0438\u043d","diagnose":"\u041f\u0438\u0437\u0434\u0430\u0440\u0438\u043a\u0438","operation_date":"2014-01-21","operation":"\u041e\u0431\u0440\u0435\u0437\u0430\u043d\u0438\u0435","price":"3000"},{"id":"2","first_name":"\u0410\u0440\u043a\u0430\u0434\u0438\u0439","second_name":"\u0418\u043c\u043f\u0435\u0440\u0430\u0442\u043e\u0440\u043e\u0432\u0438\u0447","surname":"\u0416\u0438\u043b\u0438\u0441\u0442\u044b\u0439","diagnose":"\u041f\u043e\u0435\u0431\u0443\u0448\u0435\u0447\u043a\u0438","operation_date":"2014-01-25","operation":"\u041e\u0431\u0435\u0437\u0433\u043b\u0430\u0432\u043b\u0438\u0432\u0430\u043d\u0438\u0435","price":"1500"},{"id":"3","first_name":"\u0411\u043e\u0440\u0438\u0441","second_name":"\u0412\u0438\u0442\u0430\u043b\u044c\u0435\u0432\u0438\u0447","surname":"\u0422\u0440\u0430\u043a\u0442\u043e\u0440","diagnose":"\u041a\u043e\u0441\u043e\u0451\u0431\u0438\u0435","operation_date":"2014-11-23","operation":"\u041f\u0440\u043e\u0442\u0435\u0437\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0435","price":"4700"},{"id":"4","first_name":"\u0421\u0435\u0440\u0433\u0435\u0439","second_name":"\u0421\u0435\u0440\u0433\u0435\u0435\u0432\u0438\u0447","surname":"\u041a\u0430\u0440\u0442\u043e\u0448\u0438\u043d","diagnose":"\u0424\u0413\u041c","operation_date":"2014-01-20","operation":"\u0412\u0441\u043a\u0440\u044b\u0442\u0438\u0435","price":"8700"}]}

Извините, если он слишком большой и неуклюжий, но мне кажется, что ответ содержит все необходимые параметры для сопоставления с объявленными полями модели. Кто-нибудь видит, где моя ошибка?

Answer 1

Как отмечено в комментарии, ваш root неверно и должно быть client_ops, Как примечание: вам не нужно создавать экземпляры объектов напрямую, вы можете объявить свой магазин следующим образом:

Ext.define('Ext.custom.OperatedClientsGrid', {
    extend: 'Ext.grid.Panel',
    cls: 'custom-grid',
    columnLines: true,
    initComponent: function() {
        this.store = {
            model: 'OperatedClient',
            proxy: {
                type: 'ajax',
                reader: {
                    root: 'client_ops'
                }
            }
        };
        this.columns = [];
    }
});

Предложил бы @Akatum опубликовать в качестве ответа, пожалуйста, не принимайте это, поскольку @Akatum уже опубликовал решение, я просто хотел упомянуть побочный момент, но это слишком долго, чтобы оставлять комментарии.