Extjs获取后台数据,grid中无法显示,急!!!!!

成长之路2020 2013-11-04 11:57:53
/**
后台获取到的数据
{ success:true,totalSize:5,
datas:[
{stuAge:"23",stuHeight:"895",stuWeight:"89",stuName:"jim",stuScore:"45"},
{stuAge:"3444",stuHeight:"178",stuWeight:"78",stuName:"李雷",stuScore:"701"},
{stuAge:"27",stuHeight:"67",stuWeight:"189",stuName:"吉姆",stuScore:"89"},
{stuAge:"45",stuHeight:"454",stuWeight:"1221",stuName:"童米",stuScore:"65"},
{stuAge:"343",stuHeight:"34",stuWeight:"34",stuName:"DF",stuScore:"34"}
]
}
*/

Ext.onReady(function() {

var queryForm = new Ext.form.FormPanel({
id : 'queryForm',
region : 'center',
border : false,
labelAlign : 'right',
labelWidth : 90,
bodyStyle : 'padding:5px',
buttonAlign : 'center',
autoHeight : true,
autoWidth : true,
applyTo : "queryForm",
items : [{
xtype : 'fieldset',
title : '学生信息查询',
autoHeight : true,
autoHeight : true,
collapsed : false,
collapsible : true,
animCollapse : true,
items : [{ // 行1
layout : "column", // 从左往右的布局
border : false,
items : [{
columnWidth : .4, // 该列有整行中所占百分比
layout : "form", // 从上往下的布局
border : false,
items : [{
xtype : 'textfield',
fieldLabel : '姓名',
name : 'stuName',
id : 'stuName',
anchor : '80%'
}]
},
{
columnWidth : 0.3, // 该列有整行中所占百分比
layout : "form", // 从上往下的布局
border : false,
items : [{
xtype : 'numberfield',
fieldLabel : '最低分数',
name : 'minScore',
id : 'minScore'
// vtype:
// 'daterange',
// startDateField:
// 'startdt', // id
// of the end date
// field
// anchor:'100%'
}]
}, {
columnWidth : 0.3, // 该列有整行中所占百分比
layout : "form", // 从上往下的布局
border : false,
items : [{
xtype : 'numberfield',
fieldLabel : '最高分数',
name : 'maxScore',
id : 'maxScore'
}]
}]
}],
buttons : [{
iconCls : 'btn-search',
text : '查 询',
width : 75,
height : 20,
disabled : false,
handler : queryFun
}]
}]
});


// 创建表格列
var cum = new Ext.grid.ColumnModel([
new Ext.grid.RowNumberer(), // 自动产生行号
//{header:"序号",dataIndex:"stuId"},
{header:"姓名",dateIndex:'stuName'},
{header:"年龄",dateIndex:'stuAge'},
{header:"分数",dateIndex:'stuScore'},
{header:"体重",dateIndex:'stuWeight'},
{header:"身高",dateIndex:'stuHeight'}
]);

var store = new Ext.data.JsonStore({
autoLoad:false,
proxy:new Ext.data.HttpProxy({url:ctxPath+'/student/index.shtml?method=query'}),
reader:new Ext.data.JsonReader({
totalProperty:'totalSize',
successProperty: 'success',
root:'datas'
},[
{name:'stuName',mapping:'stuName'},
{name:'stuAge',mapping:'stuAge'},
{name:'stuScore',mapping:'stuScore'},
{name:'stuWeight',mapping:'stuWeight'},
{name:'stuHeight',mapping:'stuHeight'}
])
/*autoLoad: false,
url: ctxPath+'/student/index.shtml?method=query',
root:'datas',
totalProperty:'totalSize',
fields:['stuName','stuAge','stuScore','stuWeight','stuHeight']*/

});

// 网格布局
var grid = new Ext.grid.GridPanel({
id : 'data',
title : '学生信息列表',
frame : true,
store : store,
//selectedRowNumber : 0,
stripeRows : true,
// enableColumnMove: false,
enableHdMenu : false,
applyTo : "dataGrid",
viewConfig : {
// True表示为自动展开/缩小列的宽度以适应grid的宽度,这样就不会出现水平的滚动条
forceFit : true
},
loadMask : {
msg : '正在查询数据,请稍候......'
},
viewConfig : {
forceFit : true, // 让grid的列自动填满grid的整个宽度,不用一列一列的设定宽度。
emptyText : '未查询到记录'
},
cm : cum,
tbar:[{
id:'add',
text:'新增',
iconCls:'add',
handler:showAdstoretudent
},{
id:'delete',
text:'删除',
iconCls:'delete',
handler:function(){

}
},{
id:'edit',
text:'修改',
iconCls:'edit',
handler:function(){

}
}],
bbar:new Ext.PagingToolbar({
store:store,
pageSize:15,
displayInfo:true,
emptyMsg:"未查询到记录",
displayMsg:'显示第{0}条到{1}记录,一共{2}条'
/*Load:function(start){
var o ={};
pn = this.getParams();
o[pn.start] = start;
o[pn.limit] = this.pageSize;
this.store.load({params:o});
}*/
})
});


function queryFun(){
/*//var stuName = Ext.getCmp('stuName').getValue();
//var minScore = Ext.getCmp("minScore").getValue();
//var maxScore = Ext.getCmp("maxScore").getValue();

store.on('beforeload',function(){
store.baseParams = {
stuName:stuName,
minScore:minScore,
maxScore:maxScore
};
});*/

store.proxy = new Ext.data.HttpProxy({
url:ctxPath+"/student/index.shtml?method=query",
method:'post'
});
store.load({params:{start:0,limit:15}});
}
});
...全文
121 回复 打赏 收藏 转发到动态 举报
写回复
用AI写文章
回复
切换为时间正序
请发表友善的回复…
发表回复

87,910

社区成员

发帖
与我相关
我的任务
社区描述
Web 开发 JavaScript
社区管理员
  • JavaScript
  • 无·法
加入社区
  • 近7日
  • 近30日
  • 至今
社区公告
暂无公告

试试用AI创作助手写篇文章吧