ExtJS4如何自动生成控制格子的列显示、隐藏的检验盒

由于某种原因，需要做一个控制格子列显示的checkboxgroup，虽然EXTJS4中的gridpanel自带列表可以来控制列的显示隐藏，但是有这样的需求（需要一目了然)下面先上图

接着前几天做的工作，今天上午完成了定制字段，思路是在上面的普通查询或者高级查询结束以后，获得了列的字段、列等信息，然后交给一个处理函数制作定制面板，该函数用来生成checkboxgroup，生成的时候给它加上一个事件，原本以为检验盒会有类似于支票的事件，结果应用程序接口看了看貌似只有个变化事件可以用医学博士。下面贴下自己写的makefcustommadedpanel函数。用来根据格子的列自动生成checkboxgroup(整个格子的标头内容等信息均从后台得到，不管后台发来一个什么表，都能生成一个checkboxgroup来控制列的隐藏显示)参数分别是gridpanel在改装的时候用到的田地（复数);场；域；字段和列，期中的列管理器。头球攻门RCT。物品。得到(th。itemid)；是关键。这句用来获得网格_a的列信息。貌似在美国石油学会(美国石油协会)中查不到。网上找了几中方法都不适合。又不想给每个列一个身份证。这是在stackoverflow.com/上找到的http://stackoverflow。com/questions/20791685/ext js-4-how-do-I-hide-show-grid-columns-on-fly复制代码代码如下：函数makefcustommadedpanel(字段，cl){ var x=cusmadedpanel。GetComponent('自定义');//控制台。日志(cusmadedpanel。getcomponent('自定义'));for(var I=0；ifields . LengiI){ x . add({ xtype : '复选框字段'，boxLabel : cl[i]).标题，输入值：字段[i].name，checked:true，itemId:i，name : 'custom '，listeners : { change : function(th，value，oldValue，eop){ var t=grid _ a . column manager。头球攻门RCT。物品。得到(th。itemid)；if(t . is visible()){ t . set visible(false)；} else { t . set visible(true)；} //grid_a.columns[3].setVisible(false)；}} } );} } 在给出自定义面板复制代码代码如下：分机。定义(' customMadePanel '，{ extend : 'Ext.form.Panel '，title : '定制字段，可折叠：真的，项目： [ { itemId: '自定义，xtype : 'checkboxgroup '，fieldLabel : '选择字段，列： 6,项： [] }] //collapsed:true，})；var cusmadedpanel=new custommadedpanel()；我这种做法的不足也很明显，makeCustomMadePanel函数中的循环生成检验盒组件太耗时了，38个组件足足花了好几秒。用户体验肯定不好。 并且目前是在每次查询完之后都根据查询的结果生成一遍。我再想想好的解决办法今天对makefcustommadedpanel做了优化，生成组件的速度与先前相比提升非常明显！复制代码代码如下：函数MakecustomMadePanel(field，cl)cusMade=1；var x=cusmadedpanel。getcomponent('自定义');//控制台。日志(cusmadedpanel。getcomponent('自定义'));var fie=[]；for(var I=0；ifields . LengiI){//x . add(var temp={ xtype : '复选框字段'，boxLabel : cl[i].表头，//输入值：字段[i].name，checked:true，itemId:i，name : 'custom '，listeners : { change : function(th，value，oldValue，eop){ var t=grid _ a . column manager。头球攻门RCT。物品。得到(th。itemid)；//控制台。log(t . is visible())；//控制台。日志(' break ')；if(t . is visible()){ t . set visible(false)；} else { t . set visible(true)；}//控制台。log(t . is visible())；//var t1=grid _ a .列管理器。头球攻门RCT。物品。得到(th。itemid)；//控制台。日志(t1)；//grid_a.columns[3].setVisible(false)；}} };//控制台。日志(临时)；呸。推送(温度)；}//控制台。日志；x . add(fie)；思路就是先循环组好需要生成的组件对象，然后一次添加，每一次增加的开销非常大，变为一次速度真的提升了很多很多~