extjs4-extjs的grid在页面上无法显示

作者:用户 来源:互联网 浏览:312 次 时间:2016-03-24 16:12:29

extjs4htmlcss

extjs4-extjs的grid在页面上无法显示 - 摘要: extjs的grid在页面上无法显示js代码如下,效果就是页眉,页脚,和右边的表单可以显示出来,中间网格空白,F12可以看到请求成功,并且返回了数据,求帮助!Ext.onReady(function(

问题描述

extjs的grid在页面上无法显示

js代码如下,效果就是页眉,页脚,和右边的表单可以显示出来,中间网格空白,F12可以看到请求成功,并且返回了数据,求帮助!

Ext.onReady(function(){
//页面整体布局
var viewport = new Ext.Viewport({
layout:'border'
items:[{
region:'north'
html:'

学生信息管理'
}grid{ //这里放网格
region:'east'
html:'表单'
}{
region:'south'
html:'
页脚'
}]
});
var sexRenderer = function(value){
if(value){
return '男';
}
else{
return '女';
}
};
var store = new Ext.data.JsonStore({
    proxy : new Ext.data.HttpProxy({                url : 'test'// 相对路径            })    reader : new Ext.data.JsonReader({        totalProperty : 'totalCount'//总条目数        root : 'students' //数据    })    fields : [{                name : 'name'            } {                name : 'gender'            } {                name : 'tel'            } {                name : 'political'            } {                name : 'professional'            }]     pageSize:2});store.load({params:{start:0limit:2}});

//构造列

var columns = new Ext.grid.ColumnModel([    {header:'姓名'dataIndex:'name'}    {header:'性别'dataIndex:'gender'renderer:sexRenderer} //为真返回男,否则女    {header:'电话'dataIndex:'tel'}    {header:'政治面貌'dataIndex:'political'}    {header:'专业'dataIndex:'professional'}]);

columns.defaultSortable = true;
//构造网格

var grid = new Ext.grid.GridPanel({     viewConfig : {         forceFit : true     }     region:'center'     store :store     cm : columns     bbar:new Ext.PagingToolbar({            pageSize:2            store:store            displayInfo:true            displayMsg:'show{0}th to {1}th record sum{2}'            emptyMsg:'No Record!'          }) });

});

解决方案

reader是proxy的配置

    proxy :new Ext.data.HttpProxy({    url: 'test' // 相对路径    reader: new Ext.data.JsonReader({        totalProperty: 'totalCount' //总条目数        root: 'students' //数据    })})
【云栖快讯】你想见的Java技术专家都在这了,向大佬提问,有问题必答  详情请点击
云栖社区(yq.aliyun.com)为您免费提供extjs4-extjs的grid在页面上无法显示相关信息,包括 extjs4htmlcss 的信息 ,所有extjs4-extjs的grid在页面上无法显示相关内容均不代表云栖社区的意见! 该页面h5页面的地址是:https://m.aliyun.com/yunqi/wenzhang/show_98634,您可以点击extjs4-extjs的grid在页面上无法显示-手机站访问。
弹性可伸缩的计算服务,助您降低 IT 成本,提升运维效率

40+云计算产品,6个月免费体验

现在注册,免费体验40+云产品,及域名优惠!

云服务器9.9元/月,大学必备

热点导航