gridpanel与后台数据库的交互

Question

我想做这么个功能：在struts的action里调用方法得到数据库内容，然后在girdpanel 里显示. 但是页面只是显示数据，没有控件。不知道原因，我的表里就2个字段，id和name,希望高手能给解决下~谢谢啦。我的代码如下：
test.js:
Ext.onReady(function() {
var reader = new Ext.data.JsonReader({
root : 'list',
totalProperty : 'totalProperty',
fields : [{
name : 'name',
mapping : 'list.name'
}, {
name : 'id',
mapping : 'list.id'
}]
}

);
var store = new Ext.data.JsonStore({
proxy : new Ext.data.HttpProxy({
url : 'person.do',
method : 'GET',
reader : reader
})

});
var cm = new Ext.grid.ColumnModel([{
header : "name",
dataIndex : "name"
}, {
header : "id",
dataIndex : "name"
}]

);
var panel = new Ext.grid.GridPanel({
title : "EXT Grid",
width : 500,
height : 200,
store : store,
cm : cm

});
panel.render(Ext.getBody());
});



Person.Action:
Configuration con = new Configuration().configure();
SessionFactory sf = con.buildSessionFactory();
Session session = sf.openSession();
List l = null;
String hql = "FROM Person";
Query q = session.createQuery(hql);
l = q.list();
int totalProperty=l.size();
Iterator it = l.iterator();
JSONArray jsonArray = new JSONArray();
try {
while (it.hasNext()) {
Person p = (Person) it.next();
JSONObject jsonObject = new JSONObject();
jsonObject.put("id", p.getId());
jsonObject.put("name", p.getName());
jsonArray.put(jsonObject);

}
} catch (JSONException e) {
e.printStackTrace();
}
JSONObject responseJSON = new JSONObject();
try {
responseJSON.put("list", jsonArray);
responseJSON.put("totalProperty", totalProperty);
response.getWriter().write(responseJSON.toString());
} catch (JSONException e) {
e.printStackTrace();
} catch (IOException e) {
e.printStackTrace();
}
return null;
}

页面显示如下：{"list":[{"name":"mp ","id":1},{"name":"xjj ","id":2},{"name":"tyk ","id":3},{"name":"fp ","id":4},{"name":"jll ","id":5},{"name":"zb ","id":6},{"name":"zaer ","id":7}],"totalProperty":7}

地址栏：http://localhost:8080/EXT/person.do
问题补充：
不好意思 昨天是我的一点错误 ，现在问题是页面只显示gridpanel，没有数据的现实！！

Answer 1

可能是这里的原因：
var reader = new Ext.data.JsonReader({
root : 'list',
totalProperty : 'totalProperty',
[color=red] fields : [{
name : 'name',
mapping : 'list.name'
},
{
name : 'id',
mapping : 'list.id'
}][/color]
});

改为这样试试：
var record = Ext.data.Record.create([
{
name: 'id',
mapping: 'id'
},

    {
        name: 'name',
        mapping: 'name'
    },

]);
var store = new Ext.data.Store({
proxy: new Ext.data.HttpProxy({
url : 'person.do',
method : 'GET'
}),
reader: new Ext.data.JsonReader({
root: 'list',
totalProperty: 'totalProperty',
remoteSort:true
},record)
});
[color=red]store.load();[/color]或者[color=red]autoLoad:true;[/color]这个加在new Ext.data.Store中
比如：
var store = new Ext.data.Store({
[color=red]autoLoad:true,[/color]
proxy: new Ext.data.HttpProxy({
url : 'person.do',
method : 'GET'
}),
reader: new Ext.data.JsonReader({
root: 'list',
totalProperty: 'totalProperty',
remoteSort:true
},record)
});