问题描述
我的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调试了一下，可以看到从后台返回的数据，如下图所示 问题补充：谢谢楼上的回答，刚试过了，不行我网上找了些资料，有人说是布局的问题，我的grid嵌套在tab里，tabpanel嵌套在viewport里，没有去刷新，所以显示不了数据，但我不知道怎么修改
解决方案
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gbk"> <title>04.form</title> <link rel="stylesheet" type="text/css" href="../../resources/css/ext-all.css" /> <script type="text/javascript" src="../../adapter/ext/ext-base.js"></script> <script type="text/javascript" src="../../ext-all.js"></script> <script type="text/javascript">Ext.onReady(function(){CurrentDataGrid = function(viewer, config){ this.viewer = viewer; Ext.apply(this, config); 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 }); }; 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":"办公照明用电"}]}; Ext.extend(CurrentDataGrid, Ext.grid.GridPanel,{renderTo:Ext.getBody(),height:500}); new CurrentDataGrid().store.loadData(s);}); </script> </head> <body> </body></html>你的程序这样测试 发现没有问题 都出来了
解决方案二：
没有刷新 只有取得grid然后 grid.store.load后台
解决方案三：
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: ["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'}]试试