ExtJs grid取到数据而不显示的解决（亲测）

本文内容使用ExtJs 4.0下亲测通过。刚开始通过网上找的很多方法都不靠谱。

   1: var store = new Ext.data.JsonStore({

   2: url: 'gridData.php',

   3: root: 'movies',

   4: fields: ['film_id', 'title', 'release_year', 'rating']

   5: });

   6: var grid = new Ext.grid.GridPanel({

   7:     title:'Movies',

   8:     store: store,

   9:     columns: [

  10:                 { header: "ID",  30, dataIndex: 'film_id',sortable: true, hidden:true },

  11:                 { id: 'title-col', header: "Title",  180,dataIndex: 'title', sortable: true },

  12:                 { header: "Rating",  75, dataIndex: 'rating',sortable: true },

  13:                 { header: "Year",  75, dataIndex: 'release_year',sortable: true, align: 'center' }

  14:         ],

  15:     autoExpandColumn: 'title-col',

  16:     renderTo: Ext.getBody(),

  17:      600,

  18:     height: 300,

  19:     loadMask: true

  20: });

  21: store.load();

 

以上是javascript代码，json格式数据从服务器取得，在firefox+firebug中可以看到已经取得数据：

   1: { "count":2, "movies":[{ "film_id":"1", "title":"ACADEMY DINOSAUR", "description":"An Epic Drama of a Feminist And a Mad Scientist who must Battle a Teacher in The Canadian Rockies", "release_year":"2006", "rating":"PG", "special_features":"Deleted Scenes,Behind the Scenes" }, { "film_id":"2", "title":"ACE GOLDFINGER", "description":"An Astounding Epistle of a Database Administrator And an Explorer who must Find a Car in Ancient China", "release_year":"2006", "rating":"G", "special_features":"Trailers,Deleted Scenes" } ] }

运行代码后，发现已经显示grid，但是没有数据显示。修改成如下代码后正常显示：

   1: var store = new Ext.data.JsonStore({

   2:     proxy: {

   3:         url: 'gridData.php',

   4:         type: 'ajax',

   5:         reader: {

   6:             type: 'json',

   7:             root: 'movies'

   8:         }

   9:     },

  10:     fields: ['film_id', 'title', 'release_year', 'rating']

  11: });