Question

extjs异步加载树 始终无法显示数据

最近学ExtJs 求大虾指教。
问题描述：如题
代码：
前台：
<link rel="stylesheet" href="ext-4.0.7-gpl/docs/extjs/resources/css/ext-all.css" type="text/css"></link></head>
<script type="text/javascript" src="ext-4.0.7-gpl/ext-all.js"></script>
<script type="text/javascript" src="ext-4.0.7-gpl/locale/ext-lang-zh_CN.js"></script>
<script type="text/javascript" src="ext-4.0.7-gpl/src/tree/plugin/TreeViewDragDrop.js"></script>
<script type="text/javascript">
Ext.onReady(function(){
Ext.regModel("OrgInfo",{
fields:['orgId','name','count']
});
var myStore = new Ext.data.TreeStore({
model:'OrgInfo',
nodeParam:'orgId',
proxy:{
type:'ajax',
url:'treeServer.jsp',
reader:'json'
},
autoLoad:true,
root:{
name:'根节点',
id:'-1'
}
});
Ext.create('Ext.tree.Panel',{
title:'异步加载树',
renderTo:Ext.getBody(),
width:250,
height:150,
columns:[{
xtype:'treecolumn',//树状表格列
text:'公司名称',
dataIndex:'name',
width:150,
sortable:true
},{
text:'员工人数',
dataIndex:'count',
flex:1,
sortable:true
}],
store:myStore,
rootVisible:false
});
});
</script>
服务器：
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
String orgId = request.getParameter("orgId");
String result = "";
if("-1".equals(orgId)){
result = "[{id:100,name:'总公司',count:100}]";
}
if("100".equals(orgId)){
result = "[{name:'分公司一',count:20,id:110},{name:'分公司二',count:80,id:120}]";
}
if("120".equals(orgId)){
result = "[{name:'部门一',count:100,id:30,leaf:true},{name:'部门二',count:50,id:122,leaf:true}]";
}
response.getWriter().write(result);
%>
运行结果：

Answer 1

1、应该习惯指定field的类型：
fields:[{name: 'orgId', type: 'string'},
{name: 'name', type: 'string'},
{name: 'count', type: 'string'}]
2、无法显示的主要原因是你指定了JSON类型reader却没有明确root属性
3、而且你后端的输出是ARRAY里面包着JSON记录，前端怎么读都会错
4、可以比对官方文档示例并查看源码

http://docs.sencha.com/extjs/4.0.7/#!/example/tree/treegrid.html
http://docs.sencha.com/extjs/4.0.7/extjs-build/examples/tree/treegrid.js
http://docs.sencha.com/extjs/4.0.7/extjs-build/examples/tree/treegrid.json