`
rdman
  • 浏览: 84315 次
  • 性别: Icon_minigender_1
  • 来自: 陕西
社区版块
存档分类
最新评论

extjs中批量生成checkgroup

    博客分类:
  • ext
 
阅读更多
★Ext的Ajax请求的编写
Ext.Ajax.request({
    url: '',
    callback: function(options,success,response){
        if(success = true){
            response.responseText; //可由后台获取JSON格式数据进行解析
        }else{
        }
    }
});
★JSON格式数据的组装和读取
参考:Javascript解析由服务器返回的JSON格式数据
★CheckboxGroup的基本编写方法(checkbox的构造和拼接)
{boxLabel:'部门查看',name:'department-view',id:'department-view',inputValue:'department-view'}
★将字符串转换为Javascript语句的函数:eval()
★Ext.form.FormPanel的add()方法:添加组件
★Ext.form.FormPanel的doLayout()方法:重新计算容器的布局尺寸。当有新组件加入到已渲染容器或改变子组件的大小/位置之后,就需要执行此函数。
备用工具:
Javascript手册,ExtJS API文档
提示:
ExtJS中的CheckboxGroup(和RadioGroup)默认不能动态添加item。虽然它继承了Ext.form.Field,但是却类似于容器。
在CheckboxGroup构造是,它会将配置中的items等配置项处理生成一个对应的panel,该处理过程只有一次,所以很难对CheckboxGroup进行动态修改。
如果需要根据后台数据动态创建的话,最好试着创建整个CheckboxGroup,而不是动态添加item。
下面是一个根据后台数据动态创建CheckboxGroup的例子:
Ext.Ajax.request({
url: 'control/privilege/EmployeeManage-privilegeGroupSetUI.action?username='+ username,
callback: function(options,success,response){
if(success = true){
        var obj = eval( "(" + response.responseText + ")" );
        //拼接checkbox子项目
        var checkboxitems="";
        for(var i = 0;i<obj.groups.length;i++){
        if(checkboxitems!="")
        checkboxitems+=",";
        else
        checkboxitems+="[";
                var groupid = obj.groups[i].groupid;
//                 alert(obj.groups[i].name);
    var checkboxSingleItem = "{boxLabel:'"+obj.groups[i].groupname+"',name:'"+obj.groups[i].groupname+"',id:'"+obj.groups[i].groupid+"',inputValue:'"+obj.groups[i].groupid+"'";

    var usergroup=obj.usergroups;
    for(var j=0;j<usergroup.length;j++){
//        alert();
                if(usergroup[j].groupid == groupid){
                checkboxSingleItem += ",checked:'true'";
                }
    }
    checkboxSingleItem+="}";
//                alert(checkboxSingleItem);
    checkboxitems+=checkboxSingleItem;
            }
        checkboxitems+="]";
//         alert(checkboxitems);
        var itemsGroup = new Ext.form.CheckboxGroup({
    fieldLabel: '选择权限',
    name:'user_add_checkboxgroup',
    width:380,
    id:'user_add_checkboxgroup',
        columns: 1,
            name:'items',
            width:360,
            columns:1,
            items:eval(checkboxitems)
        });

        addFormPanel.add(itemsGroup);
        addFormPanel.doLayout();

} else {
Ext.MessageBox.alert('信息提示',"加载权限失败");
}
}
});
分享到:
评论

相关推荐

    EXtjs 图片批量上传

    本教程将深入探讨如何在ExtJS中实现图片的批量上传功能,以及与之相关的批量删除操作。 首先,批量上传图片的核心是利用HTML5的File API,它允许用户在不离开当前页面的情况下读取、处理和上传本地文件。在ExtJS中...

    ExtJs代码自动生成

    在开发过程中,有时需要根据数据库结构或者业务需求自动生成相应的ExtJS代码,以提高开发效率和代码一致性。下面将详细解释如何使用ExtJS进行代码自动生成,以及各组件类型的中文解释。 1. **数据库字段的映射** ...

    EXTJS批量上传下载

    EXTJS批量上传下载是EXTJS框架中实现的一种高级交互功能,允许用户一次性处理多个文件的上传和下载操作,极大地提高了工作效率。EXTJS是一款强大的JavaScript组件库,它提供了丰富的UI控件和灵活的数据绑定机制,...

    extjs界面生成器extjs界面生成器extjs界面生成器

    extjs界面生成器extjs界面生成器extjs界面生成器extjs界面生成器extjs界面生成器

    Extjs主界面生成导航

    1. 生成功能导航:在Extjs中,我们可以使用Tree Panel组件来生成导航菜单。首先,需要拖拽一个Tree Panel到“west”占位符中,以便在主界面中显示导航菜单。 2. 建立“导航模型”:在Extjs中,我们需要建立一个模型...

    ExtJs原生批量上传+实时进度

    ExtJs原生批量上传 + 实时进度 Ext.define('MyApp.ux.upload.UploadWindow', { extend: 'Ext.window.Window', height: 400, width: 700, title: '文件上传', closeAction: 'hide', maximizable: true, ...

    EXTJS代码生成器

    EXTJS代码生成器是一款专为开发人员设计的工具,它能够自动生成基于EXTJS框架的MVC模式应用程序的代码,显著提升开发效率。EXTJS是一个强大的JavaScript库,用于构建富客户端Web应用,提供了丰富的组件库和强大的...

    ExtJs动态grid的生成

    本文将深入探讨如何在ExtJS中动态生成Grid,这是一个非常实用的功能,可以适应不断变化的数据需求和用户交互。我们首先从标题"ExtJs动态grid的生成"开始,了解动态生成Grid的基本概念和实现方法。 动态生成Grid意味...

    extjs动态生成表格,前台+后台

    在本文中,我们将深入探讨如何使用ExtJS框架在前端动态生成表格,并结合后端数据进行展示。ExtJS是一个强大的JavaScript库,专用于构建富客户端Web应用程序,尤其在创建交互式用户界面方面表现突出。动态生成表格是...

    Extjs动态Grid的生成 htm

    Extjs动态Grid的生成 htm

    extjs点击右侧面板生成tab

    extjs点击右侧面板生成tab,面板是ul+li的

    ExtJs批量文件上传显示进度前后代码

    在本文中,我们将深入探讨如何使用ExtJs3.0结合SWFUpload实现批量文件上传,并在上传过程中实时显示进度。这个技术方案适用于那些需要在Web应用程序中处理大量文件上传的场景,例如用户需要一次性上传多张图片或者...

    extjs页面布局生成器

    很好的ext页面布局自动生成功能,快速布局,减少你页面开发时间!用法:解压-&gt;添加文件夹到一个web工程当中-&gt;进入index.html进入页面编辑就可以自由设计你的布局了,代码在查看/修改中可以看到,只需复制粘贴到自己...

    ExtJS 编写的批量上传(java实现)

    在"ExtJS编写的批量上传(Java实现)"这个项目中,我们主要关注的是使用ExtJS进行文件上传,并结合Java后端实现这一功能。 批量上传功能是许多Web应用中的常见需求,它允许用户一次性选择并上传多个文件,提高用户...

    extjs4.2 动态生成toolbar

    在 ExtJS 4.2 中实现动态生成 Toolbar,以满足 gridPanel 中动态生成带按钮及查询条件的工具栏的需求。本文将详细介绍如何实现动态生成 Toolbar,包括视图层、 Toolbar.js 和后台调用创建工具栏的方法。 视图层 在...

    ExtJs框架系列之图片批量显示,上传,删除

    在本文中,我们将深入探讨如何使用ExtJs框架实现图片的批量显示、上传和删除功能。ExtJs是一款强大的JavaScript库,专用于构建富客户端应用程序,它提供了丰富的组件和强大的数据管理能力,非常适合处理图像操作。 ...

    extjs动态生成model、store、panel

    extjs动态生成model、store、panel;sql拼接等多种技术难点

    Extjs生成主界面

    ### Extjs生成主界面 #### 一、简介 在现代Web开发中,用户界面的设计与实现至关重要。Extjs是一款强大的JavaScript框架,它提供了丰富的UI组件和工具,可以帮助开发者快速构建高性能的企业级Web应用。本文将详细...

    批量上传文件 EXTJS文件上传 上传组件

    在EXTJS中,实现批量上传文件是一项常见的需求,尤其在处理大量数据或媒体文件时。EXTJS的文件上传组件提供了方便的方式来处理这些任务,允许用户一次性选择多个文件进行上传,极大地提高了工作效率。 批量上传文件...

    MVC+Extjs架构WebMis自动生成

    升级了,大家不要下载这个了,下载我的资源里的的(MVC+Extjs架构WebMis自动生成) 只要你配置了数据库,配置了表,配置了功能菜单,每个菜单对应一个表,就能生产一个基本的系统, 基本系统:能对你的表进行CRUD,...

Global site tag (gtag.js) - Google Analytics