EXTJS 中grid 动态增加列的方法

2024-05-08 14:18:04

总结：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.dataIndexme.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动态表头动态列

EXTJS 中grid 动态增加列的方法相关推荐

html 动态修改列名,FineUI之动态增加列及修改列的实现
在FineUI的官方示例中有类似的实现.示例中实现了动态增加列,但有时我们可能需要动态修改列.先来看效果图下面是代码实现 DynamicGrid.aspx DynamicGrid.aspx.cs u ...
python获取excel某一列-Python从Excel中读取日期一列的方法
如下所示: import xlrd import datetime file=u"伏特加.xls"#注意读中文文件名稍微处理一下 data=xlrd.open_workbook(f ...
解决ueditor中没法动态配置imageurlprefix的方法
解决ueditor中没法动态配置imageurlprefix的方法参考文章: (1)解决ueditor中没法动态配置imageurlprefix的方法 (2)https://www.cnblogs. ...
python怎么读取excel某一列-Python从Excel中读取日期一列的方法
如下所示: import xlrd import datetime file=u"伏特加.xls"#注意读中文文件名稍微处理一下 data=xlrd.open_workbook(f ...
layui 表格组件中实现动态增加数据行的一种方式
layui 以界面简洁美观而吸引了不少开发人员,在使用table组件时,需要能编辑表格内容,动态增加数据行.编辑功能组件已支持.但动态增加数据行好像没有支持,网上提供的方式是,获得组件的数据集再加入一 ...
给Python的类和对象动态增加属性和方法
通常我们会将编程语言分为静态和动态.静态语言的变量是在内存中的有类型的且不可变化的,除非强制转换它的类型:动态语言的变量是指向内存中的标签或者名称,其类型在代码运行过程中会根据实际的值而定.Pytho ...
Extjs中grid 的ColumnModel 属性配置
http://www.studyofnet.com/news/136.html 本文导读:Ext.grid.ColumnModel 该类用于定义表格的列模型,其配置项是一个由"列定义&quo ...
Extjs中grid 的ColumnModel 属性配置和常用方法及实例
本文导读:Ext.grid.ColumnModel 该类用于定义表格的列模型,其配置项是一个由"列定义"组成的数组,还可以是JSON组成的对象.其中也定义很多操作列的属性.方法比 ...
64. Extjs中grid 的ColumnModel 属性配置
转自:https://blog.csdn.net/u011530389/article/details/45821945 本文导读:Ext.grid.ColumnModel 该类用于定义表格的列模型, ...

最新文章

热门文章