Extjs3.0 checkboxGroup 动态添加item实现思路


Posted in Javascript onAugust 14, 2013

Extjs3.0 中的CheckboxGroup默认不能动态添加item。虽然它继承了Ext.form.Field,但是却类似于容器。
CheckboxGroup配置中的items处理生成一个对应的panel,该处理过程只有一次,所以很难对CheckboxGroup进行动态添加。

如需要数据动态创建,试着创建整个CheckboxGroup,而不是动态添加item。

var unitColumns=[]; 
for(var i = 0;i < records.length;i++){ 
unitColumns.push({ 
boxLabel: records[i].data.A11, 
name: records[i].data.A11, 
inputValue: records[i].data.A1, 
checked: false 
}); 
} 
var itemsGroup = new Ext.form.CheckboxGroup({ 
id:'unitItems', 
bodyStyle:'background-color: transparent;margin-top:10px;', 
fieldLabel: '选项', 
columns: 2, 
items: unitColumns 
}); 
Ext.getCmp('OptionsSet').add(itemsGroup); 
Ext.getCmp('OptionsSet').doLayout();
Javascript 相关文章推荐
直接生成打开窗口代码,不必下载
May 14 Javascript
javascript 装载iframe子页面,自适应高度
Mar 20 Javascript
JS链式调用的实现方法
Mar 07 Javascript
jQuery+css+html实现页面遮罩弹出框
Mar 21 Javascript
jQuery实现友好的轮播图片特效
Jan 12 Javascript
使用JavaScript的AngularJS库编写hello world的方法
Jun 23 Javascript
jquery+css3问卷答题卡翻页动画效果示例
Oct 26 Javascript
JavaScript截屏功能的实现代码
Jul 28 Javascript
JS实现按钮添加背景音乐示例代码
Oct 17 Javascript
Vue项目服务器部署之子目录部署方法
May 12 Javascript
微信小程序后台持续定位功能使用详解
Aug 23 Javascript
vue打包静态资源后显示空白及static文件路径报错的解决
Sep 02 Javascript
Javascript中判断变量是数组还是对象(array还是object)
Aug 14 #Javascript
js页面跳转的问题(跳转到父页面、最外层页面、本页面)
Aug 14 #Javascript
Microsfot .NET Framework4.0框架 安装失败的解决方法
Aug 14 #Javascript
js中return false(阻止)的用法
Aug 14 #Javascript
JavaScript中window、doucment、body的解释
Aug 14 #Javascript
onmouseover和onmouseout的一些问题思考
Aug 14 #Javascript
js之onload事件的一点使用心得
Aug 14 #Javascript
You might like
PHP中的类-什么叫类
2006/11/20 PHP
PHP 开发环境配置(Zend Server安装)
2010/04/28 PHP
php多个文件及图片上传实例详解
2014/11/10 PHP
linux下为php添加iconv模块的方法
2016/02/28 PHP
PHP使用递归按层级查找数据的方法
2019/11/10 PHP
URI、URL和URN之间的区别与联系
2006/12/20 Javascript
js下写一个事件队列操作函数
2010/07/19 Javascript
EasyUI的treegrid组件动态加载数据问题的解决办法
2011/12/11 Javascript
判断javascript的数据类型(示例代码)
2013/12/11 Javascript
SuperSlide2实现图片滚动特效
2014/06/20 Javascript
轻松创建nodejs服务器(1):一个简单nodejs服务器例子
2014/12/18 NodeJs
JavaScript事件类型中焦点、鼠标和滚轮事件详解
2016/01/25 Javascript
原生javascript实现自动更新的时间日期
2016/02/12 Javascript
jQuery实现区域打印功能代码详解
2016/06/17 Javascript
JavaScript数值千分位格式化的两种简单实现方法
2016/08/01 Javascript
JQuery遍历元素的父辈和祖先的方法
2016/09/18 Javascript
JS中实现函数return多个返回值的实例
2017/02/21 Javascript
如何解决vue与传统jquery插件冲突
2017/03/20 Javascript
jquery中each循环的简单回滚操作
2017/05/05 jQuery
vue实现图片加载完成前的loading组件方法
2018/02/05 Javascript
详解如何在vue项目中使用lodop打印插件
2018/09/27 Javascript
使用webpack搭建vue项目实现脚手架功能
2019/03/15 Javascript
Node.js在图片模板上生成二维码图片并附带底部文字说明实现详解
2019/08/07 Javascript
vue的webcamjs集成方式
2020/11/16 Javascript
[01:06:30]DOTA2-DPC中国联赛定级赛 Phoenix vs DLG BO3第二场 1月9日
2021/03/11 DOTA
Python实现二维数组输出为图片
2018/04/03 Python
pandas进行数据的交集与并集方式的数据合并方法
2018/06/27 Python
Python代码实现删除一个list里面重复元素的方法
2019/04/02 Python
北美女性服装零售连锁店:maurices
2019/06/12 全球购物
新闻专业大学生找工作的自我评价
2013/10/30 职场文书
致跳远运动员广播稿
2014/02/11 职场文书
见习期自我鉴定范文
2014/03/19 职场文书
会计学毕业生求职信
2014/06/25 职场文书
加强机关作风建设心得体会
2014/10/22 职场文书
六年级作文之预言作文
2019/10/25 职场文书
python如何获取网络数据
2021/04/11 Python