`
gongmingwind
  • 浏览: 588329 次
  • 性别: Icon_minigender_1
  • 来自: 南京
社区版块
存档分类
最新评论

Ext 编辑FormPanel时,根据带入的值选中CheckBoxGroup

    博客分类:
  • Ext
阅读更多
问题描述:
Ext 2.2中的CheckBoxGroup组件有点问题,FormPanel加载的数据无法选中CheckBox

解决方法:
1、给CheckboxGroup打一个补丁

Ext.override(Ext.form.CheckboxGroup, {
			getNames : function() {
				var n = [];

				this.items.each(function(item) {
							if (item.getValue()) {
								n.push(item.getName());
							}
						});

				return n;
			},

			getValues : function() {
				var v = [];

				this.items.each(function(item) {
							if (item.getValue()) {
								v.push(item.getRawValue());
							}
						});

				return v;
			},

			setValues : function(v) {
				// var r = new RegExp('(' + v.join('|') + ')');
				
				this.items.each(function(item) {
							var rawVal = item.getRawValue();
							if (v.contains(rawVal)) {//Contains为自定义扩展
								item.setValue(true);
							}else{
								item.setValue(false);
							}
						});
			}
		});


2、在FormPanel加载数据完成后,调用CheckboxGroup的setValues(arr)方法,设置checkbox的选中状态,代码如下:
index.adWin.doLoadLocalForm(record);
				//手动设置CheckBox的值
				if(record.get('ctrolArea')==0){//不控制地区
					Ext.getCmp('ctrolAreaGroupCmp').setValues([0]);
				}else{
					Ext.getCmp('ctrolAreaGroupCmp').setValues(record.get('adArea'));
				}
				if(record.get('ctrolSiteType')==0){//不控制网站类型
					Ext.getCmp('ctrolSiteTypeGroupCmp').setValues([0]);
				}else{
					Ext.getCmp('ctrolSiteTypeGroupCmp').setValues(record.get('adSiteType'));
				}


参考:[url]http://www.extjs.com/forum/showthread.php?t=39161 [/url]
分享到:
评论

相关推荐

    .archExtJs2.0学习系列(7)--Ext.FormPanel之第四式(其他组件示例篇).doc

    在本文中,我们将深入探讨ExtJS 2.0中的FormPanel组件,并通过具体的示例来了解如何使用不同的组件,如checkbox、radio以及htmleditor。首先,Ext.FormPanel是ExtJS中用于创建表单的主要组件,它允许我们构建复杂的...

    Ext table布局实例 formpanel的table布局

    Ext的formpanel table布局实例,有效解决了页面resize时列宽不跟随改变的问题,即列宽的自适应宽度

    Ext.FormPanel 提交和 Ext.Ajax.request 异步提交函数的区别

    当使用`Ext.FormPanel`的`getForm().submit()`方法进行异步提交时,主要特点是: - **自动处理表单数据**:`getForm().submit()`会自动获取表单内的所有字段值,无需手动构建参数对象。 - **内置验证**:在提交前...

    ext几个实例

    【EXTJS】Ext.AJAX与FormPanel在登录案例中的应用 EXTJS是一个强大的JavaScript库,主要用于构建富客户端Web应用程序。在EXTJS中,Ext.AJAX和Ext.FormPanel是两个核心组件,它们分别用于异步与服务器进行数据交互和...

    Ext 添加功能form表单实例

    根据给定的信息,本文将详细解释“Ext 添加功能form表单实例”的知识点,这主要针对Ext初学者。本文会从创建表单、字段定义、验证规则以及提交逻辑等方面进行深入探讨。 ### Ext 添加功能form表单实例 #### 表单...

    EXT3.2 多选下拉框

    多选下拉框在EXT JS中通常通过`Ext.form.CheckboxGroup`或`Ext.form.RadioGroup`类来实现,但在EXT3.2中,实现多选下拉框功能通常会使用`Ext.form.FieldSet`或`Ext.form.ComboBox`的自定义扩展。这类组件提供了复选...

    Ext教程表单表格的使用

    EXT表单FormPanel是EXT JS框架中用于创建复杂表单的组件,它允许用户输入、编辑和验证数据。在上述代码中,`sampleFormPanel`是一个FormPanel实例,包含了多个配置属性,用于定制表单的行为和外观。 1. `frame : ...

    extJs中关于formPanel动态添加组件的验证问题

    在EXT JS这个强大的JavaScript框架中,FormPanel是用于创建表单的重要组件,它允许开发者构建交互式的、数据驱动的Web应用程序。FormPanel不仅提供了一种布局管理方式,还支持各种表单元素,如文本框、复选框、下拉...

    extjs中的formPanel以及表单的应用

    当用户尝试提交表单时,ExtJS会自动检查所有字段的值是否满足验证规则。例如,我们可以通过以下方式验证用户名字段: ```javascript items: [{ fieldLabel: '用户名', name: 'username', xtype: 'textfield', ...

    EXT.form组件

    1. `form`:`Ext.FormPanel`是EXT JS中的表单面板,它是一个容器,可以容纳各种表单字段和其他组件。表单面板允许你定义布局、提交行为以及处理表单数据的方法。 2. `checkbox`:`Ext.form.Checkbox`是用于创建复选...

    EXT3.0 JSP上传

    当我们谈论“EXT3.0 JSP上传”时,我们实际上是在讨论如何利用EXT3.0的组件和功能,结合JSP来实现在Web应用中的文件上传功能。 EXT3.0提供了多种组件,如FormPanel、FileUploadField等,可以帮助我们构建一个用户...

    Ext组件描述,各个组件含义

    **2.16 Form Panel (Ext.FormPanel)** - **xtype**: `form` - **功能描述**:Form Panel 是一个包含表单字段的面板。 - **主要用途**:用于创建和管理表单,支持数据验证和提交。 **2.17 Checkbox (Ext.form....

    EXT上传附件

    在EXT应用中集成百度Ueditor,可以创建一个强大的富文本编辑器,允许用户不仅编辑文本,还能方便地上传附件。 EXT库通常与Sencha Touch或Ext JS框架一起使用,这些框架提供了完整的前端解决方案,用于构建响应式的...

    EXT3.0 登录实例

    在EXT3.0中,登录界面通常由EXT的组件构建,如FormPanel、TextField、Button等。FormPanel是承载表单元素的容器,TextField用于输入用户名和密码,Button则用于触发登录操作。登录过程涉及事件监听和处理,例如点击...

    Ext2.0 form使用实例的例程

    2. **表单字段(Form Fields)**:包括文本字段(TextField)、密码字段(PasswordField)、选择框(Checkbox)、复选框组(CheckboxGroup)、单选框(RadioButton)、下拉列表(ComboBox)、日期选择器(DateField...

    ext.net 1.x DEMO

    EXT.NET 提供了诸如 GridPanel、FormPanel 等组件来轻松实现这些功能。GridPanel 可以用来展示数据,并通过行编辑或行选择进行修改和删除操作。FormPanel 则用于创建和更新数据,它可以与后台数据库进行数据交换,...

Global site tag (gtag.js) - Google Analytics