您的位置:首页 > Web前端 > JavaScript

EXTJS 动态添加Checkbox

2015-11-20 15:29 555 查看
function test(){   

loadCheckbox();

var ShowConfigFormPanel = Ext.create('Ext.form.Panel', {

                bodyPadding : 5,

                bodyCls : 'formBackground',// 背景色CSS

                width : 300,

                height : 400,

                items : [ListFormItem]

            });   

var ListFormItem = {

            xtype : 'fieldset',

            collapsible : true,// 显示切换展开收缩状态的切换按钮

            layout : {

                type : 'table',

                columns : 2

            },

            items : [{

                     xtype: 'checkboxgroup',

                    id: 'lblName',

                    name: 'checkName',

                    columns: 6,

                    border: true,

                    anchor: '100%'

            }]
        };

}

function loadCheckbox(){

    Ext.Ajax.request({

        url: 'FindList.action',

        success: function (response) {

        //将小站名作为复选框

          var obj = eval("(" + response.responseText + ")");

          var len = obj.relist.length;//注意自己在后台返回的JSON对象,我的是relist,在FireBug打印出response

          if (obj.relist == null || len == 0) {

            return;

          }

          var checkboxgroup = Ext.getCmp("checkName");

          for (var i = 0; i < len; i++) {

            var checkbox = new Ext.form.Checkbox(

              { boxLabel: obj.relist[i].Name,//以名字作为复选框的Label

                name: i

              });

            checkboxgroup.items.add(checkbox);

          }

          SpeedListShowConfigFormPanel.doLayout(); //重新调整版面布局  

        }

      });

}
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: