`
zuyali
  • 浏览: 14771 次
  • 性别: Icon_minigender_2
  • 来自: 苏州
社区版块
存档分类
最新评论

extjs 动态生成复选框

阅读更多
根据后台返回的json数据,动态生成复选框。
1、首先定义了存放复选框的fieldset
ElementCheckBox=Ext.extend(Ext.form.FieldSet,{
id:'_fieldset',
constructor:function(){
ElementCheckBox.superclass.constructor.call(this,{
layout:'column',
xtype:'checkboxgroup',
title:'统计元素'
});
}
});
2、动态生成checkbox,添加到fieldset
function generateCheckbox(){
//采用同步请求方式
var conn = Ext.lib.Ajax.getConnectionObject().conn;
conn.open("GET", 'findAllTjzdbm.do',false);
conn.send(null);
var result=Ext.util.JSON.decode(conn.responseText);
           //或者Ext.decode (conn.responseText);
for(int i=0;i<result.length;i++){
          var _checkbox=new  Ext.form.Checkbox({   
                    id:"addboxModule"+i,               
                    name:"userModule",
                    boxLabel : result[i].tjzdmc,                  
                      inputValue : result[i].tjzdbm
          });
          if(result[i].tjzdbm=='OD_RANGE'){//OD范围必选
            _checkbox.checked=true;
          }
          Ext.getCmp('_fieldset').add(_checkbox);
                     
  }
}
3、调用generateCheckbox()方法
说明:
1、缺点是生成的每个checkbox都是紧挨着排列的,想要中间能有间隔的排列,目前没有  找到方法,若哪位大侠知道,还望指点
2、采用同步请求需导入js文件,见附件
分享到:
评论

相关推荐

    ExtJs代码自动生成

    - `CheckboxGroup`:复选框组,允许用户从多个复选框中选择一项或多项。 - `ComboBox`:下拉列表框,提供一个可展开的选项列表供用户选择。 - `DateField`:时间框,让用户选择日期或时间。 - `HtmlEditor`:富...

    ExtJs动态生成treepanel的Json格式

    6. `checked`: 新增的属性,用于在节点上生成复选框。`true`表示选中,`false`表示未选中。 在上述示例中,我们看到如何使用`checked`属性来创建带有复选框的树节点。例如: ```json { "text": "To Do", "cls": ...

    带选择框_的树

    "ExtJs动态生成含有checkBox的Tree.doc"可能详细讲解了如何使用ExtJS创建可交互的复选框树。 四、DHTMLX库的应用 DHTMLX是一个JavaScript组件库,包括了多种UI元素,如表格、树、日历等。其中,dhtmlxTree组件可以...

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

    每次循环会从records中取出一条数据,并创建一个对象,该对象包含boxLabel(显示标签)、name(复选框的name属性)、inputValue(复选框的value值)以及checked(复选框的默认选中状态)四个属性,然后将这个对象...

    ExtJS4如何自动生成控制grid的列显示、隐藏的checkbox

    在使用ExtJS4开发一个grid的时候,经常会遇到需要对grid的列进行动态的显示和隐藏操作,以适应不同的显示需求。ExtJS4中的gridpanel组件提供了一些内置的方法来控制列的可见性,但有时候需要一个更直观的方式来实现...

    grid动态生成列参考!

    4. **编辑器配置**:对于可编辑的列,我们还需要根据类型(如文本输入、复选框、单选按钮)配置相应的编辑器。这一步骤对于实现列的交互性至关重要。 ```javascript for (var i = 0; i ; i++) { var edit = null;...

    Ext+ASP.NET+SQL2005简单实现了根据数据库动态生成表单的Demo.

    在本示例中,Ext JS被用来动态创建表单组件,如文本框、下拉列表、复选框等,这些组件可以根据数据库字段的类型和属性自动生成。Ext JS的灵活性使得能够根据数据库的结构轻松调整UI。 2. **动态操作数据库**: ...

    ExtJS4.2源码+实例

    2. **Checkbox全选**:在ExtJS的GridPanel中,可以轻松实现复选框的选择功能,包括全选和反选操作,这对于数据操作和批量处理非常有用。 3. **动态选择显示哪些列**:用户可以根据需要动态隐藏或显示表格的列,这种...

    ExtJS 实用教程

    6. **Form组件**:ExtJS提供了多种表单控件,如文本框、下拉框、复选框等,以及表单验证机制。通过FormPanel可以方便地创建和管理用户输入。 7. **图表组件**:ExtJS的图表组件能生成各种类型的图表,如柱状图、...

    Selenium识别Extjs控件的解决方法整理.pdf

    至于复选框(checkbox),它们通常是input元素类型为"checkbox",我们可以利用这一特性定位,如`//input[@type='checkbox' and @name='myCheckboxName']`。如果页面上有多个复选框,我们需要额外的标识,如相邻的...

    ExtJS 3.4关于TreePanel的一些实例

    学习TreePanel时根据网上的资料自己实现的实例,结构如下: 1. 创建一棵树 2. 使用TreeLoader加载数据生成树 3. 读取本地Json数据生成树 4. 使用Servlet提供数据 ...16. 对树增加复选框 代码中有详尽的注释。

    轻松搞定Extjs

    - **带复选框的节点**: 介绍了如何在树节点中添加复选框功能,以便进行更精细的选择控制。 本书通过对Extjs框架各个方面的详细介绍,不仅为读者提供了一个全面的学习指南,也为实际开发工作打下了坚实的基础。无论...

    ExtJS Grid使用SimpleStore、多选框的方法

    而CheckboxSelectionModel允许用户在Grid中为每行添加一个复选框,实现多选功能。本文将详细介绍如何在ExtJS Grid中结合使用SimpleStore和CheckboxSelectionModel来实现多选框的功能。 首先,我们需要准备数据。...

    EXTJS教材,教程

    - **自定义能力**:可以生成行号、支持复选框全选、动态选择显示的列、本地和远程分页、单元格自定义渲染、可编辑网格、添加/删除行、脏数据提示、大小调整和行拖拽等。 - **与其他组件交互**:Grid之间以及与Tree...

    ExtJS-doc帮助文档

    6. **表单组件和验证**:ExtJS提供了大量的表单元素,如文本字段、复选框、下拉列表等,以及内置的表单验证功能,确保用户输入的数据符合预期格式。 7. **拖放功能**:2.2版本支持拖放操作,使得用户可以轻松地将...

    ExtJs简介PPT

    特别是其表格控件,不仅外观美观,功能也异常强大,包括但不限于动态行号生成、复选框全选、本地及远程分页、单元格自定义渲染等。此外,ExtJs还支持跨浏览器的UI组件,能够基于JSON/XML数据源进行开发,有效减轻...

    ExtJs 中文文档

    - **表单组件**:包括文本框、复选框、单选按钮等。 - **组件配置**:详细介绍各组件的配置选项。 #### 十七、悬停提示与验证 - **悬停提示**:当鼠标悬停在组件上时显示提示信息。 - **表单验证**:确保用户输入...

    extjs--ext-3.2.1

    4. **表单组件**:ExtJS提供了强大的表单组件,包括文本框、下拉框、复选框、单选按钮等,且支持验证和自定义布局,使得创建复杂的表单变得容易。 5. **布局管理**:3.2.1版本的ExtJS有多种布局方式,如Fit布局、...

    EXTJS___API详解

    **Checkbox, Radio, HtmlEditor, TextField, NumberField, TextArea, TriggerField 类**:表单字段类,提供了各种输入控件,如复选框、单选按钮、富文本编辑器等。 EXTJS的API详尽且强大,这些只是其中一部分,...

Global site tag (gtag.js) - Google Analytics