1. #1
    Sencha User TopKatz's Avatar
    Join Date
    Mar 2007
    Posts
    337
    Vote Rating
    2
    TopKatz is on a distinguished road

      0  

    Default Dynamic Checkgroup

    Dynamic Checkgroup


    Im trying to build a dynamic checkgroup of sorts. I know that there is no add method for the checkgroup, so I'm trying to do it on the fly, but I think my timing is off. Maybe someone has an idea for me? Here is my code:

    Code:
    Ext.namespace("Ihc.app");
    
    Ihc.app.JSONCheckGroup = Ext.extend(Ext.form.CheckboxGroup, {
        fieldLabel:'Check Group',
        allowBlank:false,
        columns:2,
        checks:[{boxLabel: 'Temp', name: 'temp'}],
        params:{routine:'getData',param:1,param2:2},
        url:'data/adminRequest.php',
        root:'data',
        autoBuild:false,
        autoHeight:true,
        map:{label:'name',name:'id'},
        getData:function(){
    
             Ext.Ajax.request({
                 url:this.url,
                 scope:this,
                 waitMsg:'',
                 params:this.params,
                 callback: function(options, success, response) {
                     if (Ext.decode(response.responseText).success == false) {
                         var er = Ext.decode(response.responseText).error;
    
                         Ihc.app.ShowSystemError(er);
                     } else {
    
                         var data = Ext.decode(response.responseText);
    
                        this.checks = [];
                         console.log(this.items)
                         for(i=0; i < data[this.root].length;i++){
    
                            var o ={
                                boxLabel:data[this.root][i][this.map.label],
                                name:data[this.root][i][this.map.name]
                             }
                            this.checks.push(o);
    
                         }
    
                     }
                 }
             });
        },
        initComponent:function() {
    
            this.config = {
                items:this.checks
            };
    
            Ext.apply(this, Ext.apply(this.initialConfig, this.config));
    
    		Ihc.app.JSONCheckGroup.superclass.initComponent.apply(this, arguments);
    	} // eo function initComponent
    
    	,onRender:function() {
    
    		Ihc.app.JSONCheckGroup.superclass.onRender.apply(this, arguments);
    
    	}, // eo function onRender
        listeners:{
            'beforerender':function(){
    
                if(this.autoBuild){
                    this.getData();
    
                }
            }
        }
    });
    
    Ext.reg('jsoncheckgroup', Ihc.app.JSONCheckGroup);
    My object load data, but I can not get the items to use my new items.

  2. #2
    Sencha User TopKatz's Avatar
    Join Date
    Mar 2007
    Posts
    337
    Vote Rating
    2
    TopKatz is on a distinguished road

      0  

    Default This works

    This works


    Code:
    Ext.namespace("Ihc.app");
    
    Ihc.app.JSONCheckGroup = Ext.extend(Ext.form.CheckboxGroup, {
        fieldLabel:'Check Group',
        allowBlank:false,
        columns:2,
        checks:[{boxLabel: 'Temp', name: 'temp'},{boxLabel: 'Temp2', name: 'temp2'}],
        params:{routine:'getData',param:1,param2:2},
        url:'data/adminRequest.php',
        root:'data',
        autoBuild:false,
        autoHeight:true,
        map:{label:'name',name:'id'},
        getData:function(){
    
             Ext.Ajax.request({
                 url:this.url,
                 scope:this,
                 waitMsg:'',
                 params:this.params,
                 callback: function(options, success, response) {
                     if (Ext.decode(response.responseText).success == false) {
                         var er = Ext.decode(response.responseText).error;
    
                         Ihc.app.ShowSystemError(er);
                     } else {
    
                         var data = Ext.decode(response.responseText);
    
    
                         this.panel.items.items[0].removeAll();
                         this.panel.items.items[1].removeAll();
                         for(i=0; i < data[this.root].length;i++){
    
                            var o ={
                                boxLabel:data[this.root][i][this.map.label],
                                name:data[this.root][i][this.map.name],
                                xtype:'checkbox'
                             }
    
                            var place = 1;
                            if(Ihc.app.isEven(i)){
                                place = 0;
                             }
                             this.panel.items.items[place].add(o)
    
    
                         }
                        this.panel.doLayout();
                     }
                 }
             });
        },
        initComponent:function() {
    
            this.config = {
                items:this.checks
            };
    
            Ext.apply(this, Ext.apply(this.initialConfig, this.config));
    
    		Ihc.app.JSONCheckGroup.superclass.initComponent.apply(this, arguments);
    	} // eo function initComponent
    
    	,onRender:function() {
    
    		Ihc.app.JSONCheckGroup.superclass.onRender.apply(this, arguments);
    
    	}, // eo function onRender
        listeners:{
            'beforerender':function(){
    
                if(this.autoBuild){
                    this.getData();
    
                }
            }
        }
    });
    
    Ext.reg('jsoncheckgroup', Ihc.app.JSONCheckGroup);

  3. #3
    Sencha User TopKatz's Avatar
    Join Date
    Mar 2007
    Posts
    337
    Vote Rating
    2
    TopKatz is on a distinguished road

      0  

    Default


    hmm -looks good but does not work quite right. It dorks the form validation and I get a TypeError: this.el.dom is undefined when I close the window that the parent form is in. Any thoughts?