ExtJS 解析json数据 动态创建grid表格

刚接触extjs,不太会。我想实现的是从后台获取到json格式的数据,然后直接创建一个grid。在网上查了很多资料,各种不懂啊。代码如下:返回的json数据为:问题如下:... 刚接触extjs,不太会。
我想实现的是从后台获取到json格式的数据,然后直接创建一个grid。在网上查了很多资料,各种不懂啊。代码如下:

返回的json数据为:

问题如下:
1,表格创建失败,大家帮忙看下哪里有问题
2,返回的json数据必须有数量count这个变量吗?直接是条目的列表不行吗?
3,reader里的数组有什么作用?该怎么写?
现在的结果是:只出来了cm的那一行
展开
 我来答
xiii130
2013-11-22 · 知道合伙人软件行家
xiii130
知道合伙人软件行家
采纳数:817 获赞数:2867
爱好编程,在工作中积累了比较丰富的经验。愿与大家共同进步。

向TA提问 私信TA
展开全部

是你自己做的太复杂了。。。写简单点就好了


//构建数据集
Ext.onReady(function() {
var store=Ext.create('Ext.data.Store', {
    //这里的字段名称是自定义的,不一定要和后台返回的一一对应,但是数量要相等,否则后面的将不会显示
    fields: ['字段1','字段2','字段3'],
    //自动加载数据
    autoLoad: true,
    proxy: {
      type: 'ajax',
      url: 'xxx',
      reader: {
        type: 'json',
        //这里的root不是一定要设置的,如果返回的本身就是表格数据,就不需要
        root: 'items'
      }
    }
  });
//构建表格
Ext.create('Ext.grid.Panel', {
    store:store,
    renderTo: Ext.getBody(),
    columns: [{
        text: '列名',
        dataIndex: '对应store的field,而不是json的字段',
    },{
        //同上
    }]
});
});
更多追问追答
追问
不行啊,后台都没接收到ajax请求
追答
那你用的什么版本的?我这是4.1的写法
墨亦竹
推荐于2016-01-18 · TA获得超过446个赞
知道答主
回答量:63
采纳率:0%
帮助的人:68.8万
展开全部

store 在ext里叫数据存储器,你上面写的太繁复,ext提供高级store


首先你要弄清楚这个过程:

 store 的load函数会触发数据存储器根据httpProxy设定的url去请求数据,请求回来的数据,要用数据读取器Reader对象,比如用你的JsonReader,每一条数据对应一个Ext.data.Record对象,你第三个问题问reader里的数组有什么用,它是Ext.data.Record的简写,你可以把那个数组写成一下这样来代替你的那个数组,不过通常为了简单起见我们都写简写


var RecordTemplate = new Ext.data.Record.create([  
/* name对应的值就是存储在本条record中的key值,当你需要
 * 从某一条数据中取出某个字段是,你就必须用这个key 
 */ 
{name: 'firstname'}, 

/* 上面说name对应的值你读取后的key索引值,那
 *  mapping对应的值就是你从后台请求回来的每一条数据元素中的一个key,
 *  意思就是,我从请求回来的数据中读取
 *  key为occupation的值存储在store  中一条record的job索引key中 
 */  
{name: 'job', mapping: 'occupation'}                                   
});


 

http proxy


1>.SimpleStore = Store + MemoryProxy + ArrayReader  用作读取静态本地数据

2>.JsonStore = Store + HttpProxy + JsonReader  用作读取后台json信息

var ds = new Ext.data.JsonStore(
{
    url:"",            //请求地址
    paramNames:{arg0:0},  //提交请求,附带的参数,通常你需要使用分页,排序,可以在这里
    fields:["key"],//对应Reader里返回json对象中的每个key,在grid里也对应ColumnModel列模型中的dataIndex
});



2,返回的json数据必须有数量count这个变量吗?直接是条目的列表不行吗?

答:不用必须,这个count是完全自定义的,你需要分页工具条时,需要指定总共多少条数据,需要一个字段存储总条数数据,至于是count,还是total,只要和你后台返回的json中去取值时对应就可以了,分页工具条,会以count作为key在你请求回来的json去取值。这是一个前后和后台的约定字段,只要保持一致,起什么名字都无关。


直接是条目的列表是行的。其实  重要的你要理解  前台  和  后台  的约定,这不是说那一边行不行,你前台定义了什么样的格式来读,你后台就要提供什么样的数据,不然读不到数据,响应,你后台提供了什么样的数据格式,前台就要按照这个格式来读。  这是  一种约定,而数据格式是完全可以自定义的。那么你安装xml格式都可以。如果你使用的读取器前台控件规定了读取方式,那么你 后台返回的数据就要严格按照这种格式来组织。不然你后台返回的数据,前台不认识就无法读取,这是有严格逻辑的。

你可以把  root:"",totalRecords:"",id:;""  这都都不要,后台返回的数据  是json Array,就是你说的条目列表就可以了。

追问

你回答的很好,很详细,可是我的问题依然没有解决,数据依然解析不出来,我现在的代码如下,用的4.2.1,请再帮忙看下,弄了好几天了:

本回答被提问者采纳
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
百度网友a5678e08f7
2013-11-21 · TA获得超过408个赞
知道小有建树答主
回答量:668
采纳率:0%
帮助的人:620万
展开全部
["siteNo","siteName","XXX",.....]
改成
[{name: 'siteNo'},{name: 'siteName'}.......]

count数据总条数,做分页的时候用的
追问
改了也不行啊,各种不出数据啊,会不会是ajax加载数据有延迟(异步)造成的
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
收起 更多回答(1)
推荐律师服务: 若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询

为你推荐:

下载百度知道APP,抢鲜体验
使用百度知道APP,立即抢鲜体验。你的手机镜头里或许有别人想知道的答案。
扫描二维码下载
×

类别

我们会通过消息、邮箱等方式尽快将举报结果通知您。

说明

0/200

提交
取消

辅 助

模 式