ExtJs4.0 grid表格不显示数据
Ext.require([
'Ext.data.*',
'Ext.grid.*',
'Ext.form.*',
'Ext.toolbar.Paging'
]);
Ext.onReady(function() {
Ext.QuickTips.init();
Ext.define('User', {
extend : 'Ext.data.Model',
fields: [
{name: 'userID',type:'int',mapping:'userID'},
{name: 'deptNo',type:'int'},
{name: 'userCode',type: 'string'},
{name: 'userName',type: 'string'},
{name: 'deptName',type: 'string'},
{name: 'parentDeptName', type:'string'},
{name: 'userPsw', type:'string'},
{name: 'userSex',type:'string'},
{name: 'userTel',type:'string'},
{name:'userEmail',type:'string'}
]});
var gridStore = Ext.create('Ext.data.Store', {
storeId:'userGridStore',
model : 'User',
proxy : {
type : 'ajax',
//url:'user/user.json'
url : 'getUserGridJson.action'
},
reader:{
type:'json',
root:'items'
},
autoLoad : true
});
var grid = Ext.create('Ext.grid.Panel', {
store: gridStore,
columnLines: true,
height: 460,
width: 900,
title: '用户管理',
frame : true,
selType : 'rowmodel',
viewConfig: {
loadMask : {msg : '正在加载数据,请稍等...'},
stripeRows: true
},
renderTo: 'user_grid',
columns: [{
header : '登录名',
//locked : true,
width : 100,
sortable : false,
dataIndex: 'userCode',
menuDisabled:true
},{
header : '用户名称',
//locked : true,
width : 100,
sortable : false,
dataIndex: 'userName'
},{
header : '部门名称',
width : 125,
sortable : true,
dataIndex: 'deptName'
},{
header : '上级部门',
width : 125,
sortable : true,
dataIndex: 'parentDeptName'
},{
header : '性别',
width : 60,
sortable : true,
dataIndex: 'userSex'
},{
header : '联系电话',
width : 100,
sortable : true,
dataIndex: 'userTel'
},{
header : '电子信箱',
width : 100,
sortable : true,
dataIndex: 'userEmail'
}]
});
});
后台返回数据成功,格式如下:
{items:[{
userID:1,
deptNo:1,
userCode:'101001',
userName:'张三',
deptName:'1部',
parentDeptName:'',
userPsw:'1',
userSex:'1',
userTel:'',
userEmail:'zs@163.com'
},{
userID:2,
deptNo:1,
userCode:'101002',
userName:'张三1',
deptName:'2部',
parentDeptName:'',
userPsw:'1',
userSex:'1',
userTel:'',
userEmail:'zs1@163.com'
} ]}
界面显示了一条空白行,没有任何内容。
[解决办法]
var gridStore = Ext.create('Ext.data.Store', {
storeId:'userGridStore',
model : 'User',
proxy : {
type : 'ajax',
//url:'user/user.json'
url : 'getUserGridJson.action',
reader:{
type:'json',
root:'rows'
}
},
autoLoad:true
});
reader:位置写错了。