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 相关文章推荐
扩展String功能方法
Sep 22 Javascript
textarea的value是html文件源代码,存成html文件的代码
Apr 20 Javascript
JavaScript模板入门介绍
Sep 26 Javascript
使用js实现雪花飘落效果
Aug 26 Javascript
javascript实现禁止右键和F12查看源代码
Dec 26 Javascript
jQuery实现textarea自动增长宽高的方法
Dec 18 Javascript
jquery实现input框获取焦点的简单实例
Jan 26 Javascript
Vue.js展示AJAX数据简单示例讲解
Mar 29 Javascript
深入理解JavaScript继承的多种方式和优缺点
May 12 Javascript
jQuery中 DOM节点操作方法大全
Oct 12 jQuery
JS实现的JSON序列化操作简单示例
Jul 02 Javascript
微信小程序实现翻牌抽奖动画
Sep 21 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转成EXE文件
2006/10/09 PHP
php静态文件生成类实例分析
2015/01/03 PHP
PHP IDE PHPStorm配置支持友好Laravel代码提示方法
2015/05/12 PHP
PHP用PDO如何封装简单易用的DB类详解
2017/07/30 PHP
PHP实现验证码校验功能
2017/11/16 PHP
基于jsTree的无限级树JSON数据的转换代码
2010/07/27 Javascript
JavaScript中使用typeof运算符需要注意的几个坑
2014/11/08 Javascript
js实现同一个页面多个渐变效果的方法
2015/04/10 Javascript
ionic在开发ios系统微信时键盘挡住输入框的解决方法(键盘弹出问题)
2016/09/06 Javascript
require.js与bootstrap结合实现简单的页面登录和页面跳转功能
2017/05/12 Javascript
详解Angular 4 表单快速入门
2017/06/05 Javascript
利用yarn代替npm管理前端项目模块依赖的方法详解
2017/09/04 Javascript
React 高阶组件入门介绍
2018/01/11 Javascript
让Vue也可以使用Redux的方法
2018/05/23 Javascript
JSON.stringify()方法讲解
2019/01/31 Javascript
axios实现文件上传并获取进度
2020/03/25 Javascript
使用Vue Composition API写出清晰、可扩展的表单实现
2020/06/10 Javascript
微信小程序中target和currentTarget的区别小结
2020/11/06 Javascript
[01:13:46]iG vs Winstrike 2018国际邀请赛小组赛BO2 第一场 8.16
2018/08/17 DOTA
在Python中进行自动化单元测试的教程
2015/04/15 Python
python爬虫 使用真实浏览器打开网页的两种方法总结
2018/04/21 Python
Python numpy.array()生成相同元素数组的示例
2018/11/12 Python
Python使用pandas对数据进行差分运算的方法
2018/12/22 Python
Python时间和字符串转换操作实例分析
2019/03/16 Python
python移位运算的实现
2019/07/15 Python
python Popen 获取输出,等待运行完成示例
2019/12/30 Python
Python count函数使用方法实例解析
2020/03/23 Python
selenium判断元素是否存在的两种方法小结
2020/12/07 Python
利用Node实现HTML5离线存储的方法
2020/10/16 HTML / CSS
巴西女装购物网站:Eclectic
2018/04/24 全球购物
中医药大学市场营销专业自荐信
2013/09/29 职场文书
大学生撤销处分思想汇报
2014/09/12 职场文书
2014最新房贷收入证明范本
2014/09/12 职场文书
fastdfs+nginx集群搭建的实现
2021/03/31 Servers
python中sqllite插入numpy数组到数据库的实现方法
2021/06/21 Python
java固定大小队列的几种实现方式详解
2021/07/15 Java/Android