Extjs Сетка с данными объекта json с сортировкой

Question

Я пытаюсь отобразить сетку. В этой сортировке не работает. Вот мой код.

<div id="grid-sample"></div> 
    <script type="text/javascript"> 
     Ext.create('Ext.data.Store', { 
      storeId:'cstore', 
      fields:['user', 'age', 'place'], 
      data: [ 
         {"user":"joe","age":27,"place":"sydney"}, 
         {"user":"abel","age":29,"place":"delhi"}, 
         {"user":"fin","age":18,"place":"san jose"} 
        ] 

     }); 

     Ext.create('Ext.grid.Panel', { 
      title: 'Sample grid', 
      store: Ext.data.StoreManager.lookup('cstore'), 
      autoCreateViewPort: false, 
      layout: 'fit', 
      columns: [ 
       { text: 'Name', xtype: 'templatecolumn', tpl: '{user}' ,sortable : true }, 
       { text: 'Age', xtype: 'templatecolumn', tpl: '{age}' ,sortable : true }, 
       { text: 'Place', xtype: 'templatecolumn', tpl: '{place}',sortable : true } 
      ], 
      width: 750, 
      renderTo: 'grid-sample' 
     }); 
    </script> 

Answer 1

Вам нужно добавить dataIndex для сортировочного работать.

Так что ваши колонки будут выглядеть,

columns: [ 
    { text: 'Name', xtype: 'templatecolumn',tpl: '{user}',dataIndex: 'user' ,sortable : true }, 
    { text: 'Age', xtype: 'templatecolumn', tpl: '{age}',dataIndex: 'age' ,sortable : true }, 
    { text: 'Place',xtype: 'templatecolumn', tpl: '{place}', dataIndex :'place',sortable : true }] 

Если значение dataIndex должно совпадать с именем поля в магазине.

Answer 2

Что делать, если dataIndex не должен ссылаться на поле, а на свойство объекта? Таким образом, данные сверху могут быть

data: [{{"user":"joe",userName:"Joeschmoe"},"age":27,"place":"sydney"}, 
{{"user":"Jane",userName:"Jany"},"age":29,"place":"delhi"}, 
{{"user":"Mary",userName:"mary123"},"age":18,"place":"san jose"} 
]