我的grid从后台加载数据成功,却显示不了数据 !
整体布局是一个viewport,左侧树形,右侧表格,当我单击树形的值时,在表格显示结果。
这是grid 代码:
CurrentDataGrid = function(viewer, config){
this.viewer = viewer;
Ext.apply(this, config);
this.store = new Ext.data.Store({
proxy: new Ext.data.HttpProxy({
url: '../currentData/currentData_gridData.jspx'
}),
reader: new Ext.data.JsonReader({
root: 'values',
totalProperty: 'rows',
remoteSort: true,
fields: ["ammeterid", "ammeterno", "measureno", "ammindex", "termno", "equip", "elcplace", "elctype"]
})
});
this.store.setDefaultSort('ammeterno', "DESC");
this.check_select = new Ext.grid.CheckboxSelectionModel({
handleMouseDown: Ext.emptyFn
});
this.columns = [new Ext.grid.RowNumberer(), this.check_select, {
id: 'ammeterid',
header: "测量点ID",
dataIndex: 'ammeterid',
width: 50,
hidden: true
}, {
id: 'ammeterno',
header: "通讯地址",
dataIndex: 'ammeterno',
sortable: true,
width: 100
}, {
id: 'measureno',
header: "测量点号",
dataIndex: 'measureno',
sortable: true,
width: 80
}, {
id: 'ammindex',
header: "表序号",
dataIndex: 'ammindex',
sortable: true,
width: 50
}, {
id: 'termno',
header: "所属终端",
dataIndex: 'termno',
sortable: true,
width: 100
}, {
id: 'equip',
header: "关联设备",
dataIndex: 'equip',
sortable: true,
width: 100
}, {
id: 'elcplace',
header: "用电场所",
dataIndex: 'elcplace',
sortable: true,
width: 100
}, {
id: 'elctype',
header: "用电类型",
dataIndex: 'elctype',
sortable: true,
width: 100
}];
CurrentDataGrid.superclass.constructor.call(this, {
region: 'center',
id: 'CurrentDataGridID',
sm: this.check_select
});
};
Ext.extend(CurrentDataGrid, Ext.grid.GridPanel, {
loadData: function(treeNodeID, selectType){
this.store.baseParams = {
treeValue_ID: treeNodeID,
selectType: selectType
};
this.store.load({
callback: function(r, options, success){
alert(r.length);
if (success) {
alert(r.length);
}
else {
alert("异常!");
}
}
});
}
});
后台返回数据:
{"rows":4,"values": [{"ammeterid":10,"ammeterno":"002084000075","measureno":112,"ammindex":12,"termno":"99999999","equip":"b- 12(一楼厂房)","elcplace":"照明用电场所","elctype":"办公照明用电"}, {"ammeterid":12,"ammeterno":"002084000066","measureno":114,"ammindex":14,"termno":"99999999","equip":"b- 14(四楼照明区)","elcplace":"照明用电场所","elctype":"办公照明用电"}, {"ammeterid":13,"ammeterno":"002084000067","measureno":115,"ammindex":15,"termno":"99999999","equip":"b- 15(三楼照明区)","elcplace":"照明用电场所","elctype":"办公照明用电"}, {"ammeterid":14,"ammeterno":"002084000069","measureno":116,"ammindex":16,"termno":"99999999","equip":"b- 16(五楼照明区)","elcplace":"照明用电场所","elctype":"办公照明用电"}]}
在IE和FF里都不显示数据,也不报错!用firebug调试了一下,可以看到从后台返回的数据,如下图所示
[img]http://dl.iteye.com/upload/attachment/288630/01887e97-8d5a-3f65-b16c-ee3117bcd3ec.jpg[/img]
04.form
<br> Ext.onReady(function(){<br> CurrentDataGrid = function(viewer, config){ <br> this.viewer = viewer; <br> Ext.apply(this, config); </p> <pre><code>this.store = new Ext.data.Store({ reader: new Ext.data.JsonReader({ root: 'values', totalProperty: 'rows', remoteSort: true, fields: ["ammeterid", "ammeterno", "measureno", "ammindex", "termno", "equip", "elcplace", "elctype"] }) }); this.store.setDefaultSort('ammeterno', "DESC"); this.check_select = new Ext.grid.CheckboxSelectionModel({ handleMouseDown: Ext.emptyFn }); this.columns = [new Ext.grid.RowNumberer(), this.check_select, { id: 'ammeterid', header: "测量点ID", dataIndex: 'ammeterid', width: 50, hidden: true }, { id: 'ammeterno', header: "通讯地址", dataIndex: 'ammeterno', sortable: true, width: 100 }, { id: 'measureno', header: "测量点号", dataIndex: 'measureno', sortable: true, width: 80 }, { id: 'ammindex', header: "表序号", dataIndex: 'ammindex', sortable: true, width: 50 }, { id: 'termno', header: "所属终端", dataIndex: 'termno', sortable: true, width: 100 }, { id: 'equip', header: "关联设备", dataIndex: 'equip', sortable: true, width: 100 }, { id: 'elcplace', header: "用电场所", dataIndex: 'elcplace', sortable: true, width: 100 }, { id: 'elctype', header: "用电类型", dataIndex: 'elctype', sortable: true, width: 100 }]; CurrentDataGrid.superclass.constructor.call(this, { region: 'center', id: 'CurrentDataGridID', sm: this.check_select }); </code></pre> <p>}; </p> <p>var s = {"rows":4,"values": [{"ammeterid":10,"ammeterno":"002084000075","measureno":112,"ammindex":12,"termno":"99999999","equip":"b- 12(一楼厂房)","elcplace":"照明用电场所","elctype":"办公照明用电"}, {"ammeterid":12,"ammeterno":"002084000066","measureno":114,"ammindex":14,"termno":"99999999","equip":"b- 14(四楼照明区)","elcplace":"照明用电场所","elctype":"办公照明用电"}, {"ammeterid":13,"ammeterno":"002084000067","measureno":115,"ammindex":15,"termno":"99999999","equip":"b- 15(三楼照明区)","elcplace":"照明用电场所","elctype":"办公照明用电"}, {"ammeterid":14,"ammeterno":"002084000069","measureno":116,"ammindex":16,"termno":"99999999","equip":"b- 16(五楼照明区)","elcplace":"照明用电场所","elctype":"办公照明用电"}]}; <br> Ext.extend(CurrentDataGrid, Ext.grid.GridPanel,{<br> renderTo:Ext.getBody(),<br> height:500<br> }); </p> <p>new CurrentDataGrid().store.loadData(s);</p> <p>});<br>
你的程序这样测试 发现没有问题 都出来了
fields: ["ammeterid", "ammeterno", "measureno", "ammindex", "termno", "equip", "elcplace", "elctype"]
改成
fields: [
{name:'ammeterid', mapping: 'ammeterid'},
{name:'ammeterno', mapping:'ammeterno'},
{name:'measureno', mapping:'measureno'}
{name:'ammindex', mapping:'ammindex'}
{name:'termno', mapping:'termno'}
{name:'equip', mapping:'equip'},
{name:'elcplace', mapping:'elcplace'},
{name:'elctype', mapping:'elctype'}
]
试试
fields: [
{name:'ammeterid', mapping: 'ammeterid'},
{name:'ammeterno', mapping:'ammeterno'},
{name:'measureno', mapping:'measureno'},
{name:'ammindex', mapping:'ammindex'},
{name:'termno', mapping:'termno'},
{name:'equip', mapping:'equip'},
{name:'elcplace', mapping:'elcplace'},
{name:'elctype', mapping:'elctype'}
]
没有刷新 只有取得grid然后 grid.store.load后台