EXTJS 中grid 动态增加列的方法

总结:gridpanel动态生成列的核心就是在拼凑columnmodel和后台返回store的数据对的上

1-首先动态拼凑columnmodel

前端拼凑例子

me.columns.push({text : '名称',width : 80,align : 'center',dataIndex : 'orgName'});//这个是展示columns是如何拼凑的

if (myDatas && myDatas.length > 0) {//myDatas 就是 后台返回的我们需要一定格式的数据
    Ext.Array.forEach(myDatas, function (myData) {
	column =  {text : myData.text,width : 80, align : 'center',dataIndex : myData.dataIndex
	me.columns.push(column);//动态拼凑columnmodel
    });
}

me.reconfigure(me.getStore(), me.columns);//将其重新绑定,不然页面不显示

这里只是一个例子,同样上面过程也可以写在后端拼凑,然后返回前端直接使用,例子如下:

后端拼凑例子

在这里插入图片描述
代码里的columnmodel就是后端拼凑好,传给前端直接使用

2-后台返回store的数据对的上

后端返回store的数据对的上例子

在这里插入图片描述
代码里的columnmodel和data要对的上。这个例子是直接把所有处理写在一个方法里了,实际开发一般是columnmodel拼凑在一个方法,data处理在另一个方法。

总结

gridpanel动态生成列的核心就是在拼凑columnmodel和后台返回store的数据对的上。

别忘了最后调用GridPanel的reconfigure()将其重新绑定,reconfigure()方法接收两个参数,一个是store,一个是ColumnModel。

另:如果上述说明不太理解,下面是几个具有参考价值的博客

链接: ExtJS GridPanel动态加载列

链接: EXTJS 中grid动态增加列的方法

链接: Ext js 4 动态Grid(包括动态列和动态数据)

链接: EXTJS系列笔记(6.X)————gridpanel根据数据动态加载需要的列,同时列根据不同值显示不同颜色

链接: Ext Js Grid实现动态添加列

链接: EXT JS GridPanel列动态生成

链接: Extjs动态加载grid表格

链接: 再谈extjs4.1中gridpanel动态表头动态列

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值