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 相关文章推荐
13个绚丽的Jquery 界面设计网站推荐
Sep 28 Javascript
js css后面所带参数含义介绍
Aug 18 Javascript
深入理解JavaScript高级之词法作用域和作用域链
Dec 10 Javascript
node.js中的fs.fsyncSync方法使用说明
Dec 15 Javascript
js控制网页前进和后退的方法
Jun 08 Javascript
谈谈基于iframe、FormData、FileReader三种无刷新上传文件的方法
Dec 03 Javascript
简单总结JavaScript中的String字符串类型
May 26 Javascript
Highcharts 多个Y轴动态刷新数据的实现代码
May 28 Javascript
jQuery滚动新闻实现代码
Jun 26 Javascript
Node.js设置CORS跨域请求中多域名白名单的方法
Mar 28 Javascript
深入浅出 Vue 系列 -- 数据劫持实现原理
Apr 23 Javascript
2020淘宝618理想生活列车自动领喵币js脚本的代码
Jun 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
40个迹象表明你还是PHP菜鸟
2008/09/29 PHP
php更改目录及子目录下所有的文件后缀扩展名的代码
2010/10/12 PHP
理解php Hash函数,增强密码安全
2011/02/25 PHP
php数组函数序列之krsort()- 对数组的元素键名进行降序排序,保持索引关系
2011/11/02 PHP
php生成缩略图示例代码分享(使用gd库实现)
2014/01/20 PHP
php获得url参数中具有&amp;的值的方法
2014/03/05 PHP
php简单备份与还原MySql的方法
2016/05/09 PHP
PHP+JS实现的商品秒杀倒计时用法示例
2016/11/15 PHP
jQuery中使用Ajax获取JSON格式数据示例代码
2013/11/26 Javascript
使用jQuery的attr方法来修改onclick值
2014/07/07 Javascript
浅谈javascript中基本包装类型
2015/06/03 Javascript
如何利用Promises编写更优雅的JavaScript代码
2016/05/17 Javascript
概述javascript在Google IE中的调试技巧
2016/11/24 Javascript
从零学习node.js之模块规范(一)
2017/02/21 Javascript
js实现带进度条提示的多视频上传功能
2020/12/13 Javascript
angular4 如何在全局设置路由跳转动画的方法
2017/08/30 Javascript
jQuery实现的form转json经典示例
2017/10/10 jQuery
JS运动改变单物体透明度的方法分析
2018/01/23 Javascript
bootstrap 弹出框modal添加垂直方向滚轴效果
2018/07/09 Javascript
你不可不知的Vue.js列表渲染详解
2019/10/01 Javascript
vue-cli4.x创建企业级项目的方法步骤
2020/06/18 Javascript
javascript实现前端input密码输入强度验证
2020/06/24 Javascript
python机器学习理论与实战(四)逻辑回归
2018/01/19 Python
Python实现爬取亚马逊数据并打印出Excel文件操作示例
2019/05/16 Python
Python之字符串的遍历的4种方式
2020/12/08 Python
IE8下CSS3选择器nth-child() 不兼容问题的解决方法
2016/11/16 HTML / CSS
简单介绍HTML5中audio标签的使用
2015/09/24 HTML / CSS
基于html5 DeviceOrientation 实现微信摇一摇功能
2015/09/25 HTML / CSS
区域销售经理职责
2013/12/22 职场文书
中秋手机店促销方案
2014/06/16 职场文书
布达拉宫的导游词
2015/02/02 职场文书
公司财务部岗位职责
2015/04/14 职场文书
Nginx服务器添加Systemd自定义服务过程解析
2021/03/31 Servers
Python 循环读取数据内存不足的解决方案
2021/05/25 Python
关于Numpy之repeat、tile的用法总结
2021/06/02 Python
Nginx实现负载均衡的项目实践
2022/03/18 Servers