Tell me more ×
Stack Overflow is a question and answer site for professional and enthusiast programmers. It's 100% free, no registration required.

I am trying to display a grid. In this sorting is not working. Here is my code.

    <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>
share|improve this question

1 Answer

up vote 0 down vote accepted

You need to add dataIndex for sorting to work.

So your columns will look like,

 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  }]

Where the value of dataIndex should match with field name in the store.

share|improve this answer
Thanks. This is working fine. – ejo Jul 15 at 10:58

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.