ext js出现以下这种数据的原因
0
悬赏园豆：10
[已解决问题]
解决于 2013-11-01 17:48
我的前台代码是:
在浏览器中显示的是以下东东:数据是出来了，但是，成下面这样了！
{"totalCount":2,"data":[{"GId":65,"GoodName":"桃子","Price":"￥6.00","Num":3},{"GId":68,"GoodName":"1","Price":"￥12.00","Num":12}]}
在前台上有个
<div id="grid"></div>
代码：
Ext.onReady(function () {
var url = "/Goods/ExtGoods";
var cm = new Ext.grid.ColumnModel([
new Ext.grid.CheckboxSelectionModel(),
{ header: "商品名称", dataIndex: "GoodName", width: 88 },
{ header: "商品价格", dataIndex: "Price", width: 88 },
{ header: "商品数量", dataIndex: "Num", width: 88 }
]);
var storeGoodsInfo = new Ext.data.Store({
proxy: new Ext.data.HttpProxy({ url: url}),
reader: new Ext.data.JsonReader({ totalProperty: "totalCount", root: "data" }, ["GId", "GoodName", "Price", "Num"])
});
//storeGoodsInfo.on("beforeload", function () { this.baseParams = { orderID: orderID} });
var pagingBarGoodsInfo = new Ext.PagingToolbar({
displayInfo: true, emptyMsg: "没有数据显示", displayMsg: "显示从{0}条数据到{1}条数据,共有{2}条数据",
store: storeGoodsInfo,
pageSize: 2
});
var gridGoodsInfo = new Ext.grid.GridPanel({
id: "menuGoods", el: "grid", layout: "fit", frame: false, width: 930, height: 210, loadMask: true,
store: storeGoodsInfo,
cm: cm,
bbar: pagingBarGoodsInfo
});
storeGoodsInfo.load({ params: { start: 0, limit: 10} });
gridGoodsInfo.render();
});
最佳答案
0
在store外面声明一个record，如下：
var goodOrder = Ext.data.Record.create([
{ name: 'GoodName', mapping: 'GoodName' },
{ name: 'Price' },
{ name: 'Num' }
]);
将reader里面的内容替换如下：
reader:new Ext.data.JsonReader({ totalProperty: "totalCount", root: "data" }, goodOrder);
仅供参考试一下哈！因为我也不是太确定。别的地方没发现有问题。
收获园豆：7
试了，但是，还是原样
@魔女小溪:
给你一个我们项目中的例子你看下：
Ext.define('Scripts.InterfaceTrackGrid', {
extend: 'Ext.grid.GridPanel',
title: '接口监控',
id: 'InterfaceTrackGrid',
initComponent: function () {
Ext.apply(this, {
closable: true, //是否可关闭
width: 400,
height: 300,
frame: true,
border: false, //grid的边界
store: InterfaceTrackStore,
iconCls: 'icon-user',
// selModel: selModel,
viewConfig: {
getRowClass: function (record) {
return record.get('IsSuccessed') ? '' : 'error-row';
}
},
columns: [Ext.create('Ext.grid.RowNumberer', { width: 35, text: '序号' }),
{
text: '编号',
width: 50,
//sortable: true,
hideable: false,
hidden: true,
dataIndex: 'ID'
}
@幕三少: 看不懂，我们公司的项目里面也有例子，但是，就是我的弄不出来
@魔女小溪: 把你代码贴过来，不要截图！
@dd_冬: 贴了
@魔女小溪: 把你的grid换成下面这个：你的render渲染方法错了。并且把gridGoodsInfo.render();去掉。
var gridGoodsInfo = new Ext.grid.GridPanel({
id: "menuGoods", layout: "fit", frame: false, width: 930, height: 210,
store: storeGoodsInfo,
renderTo: 'grid',
cm: cm,
bbar: pagingBarGoodsInfo
});
@dd_冬: 还是不行，呜呜呜
@魔女小溪: 好吧，你的环境可能有问题。我已经运行过你的代码了。
@dd_冬: 我有那么悲催吗？
@dd_冬: 我今天也遇到一个问题，js文件死活就是不加载，头疼，然后然后，只能用一个不标准的方法解决掉了。
其他回答(6)
0
支持一下，不是太懂
0
设置前台解析格式为json：application/json
你这个应该是text/plain解析的，如果前台是ajax拿到的数据，那么指定下格式就可以了。
哪个地方设置，我才刚刚学这个ext js
0
出了什么问题了？没看出什么问题啊？
晕，看来你不懂，出来的应该是个界面，但是，我出来的是上面那串东西
0
虽然我不会extjs。你说数据出来了，只是不成样子，你试试宽高等…
0
你先把分页给去掉，然后看下数据能否渲染，至于为什么把数据直接显示出来了，我搞不懂，
0
上述获取的数据是没有问题的，本来就应该是json数据，应为store里就是以json数据解析的，
应该是没有渲染到div里，将gridGoodsInfo.render();改为gridGoodsInfo.renderTo('grid');试试
收获园豆：3