1. #1
    Ext JS Premium Member
    Join Date
    Mar 2008
    Location
    Canada
    Posts
    11
    Vote Rating
    0
    dweeres is on a distinguished road

      0  

    Default add Panel not rendering

    add Panel not rendering


    The following is code that I am having trouble with:

    the problem is that the "TEST1" and "TEST2" panels are showing up, but the "TEST3" panel does not. Using firefox, I notice that the panel is never rendered, but the firefix does indicate that the panel is being added.

    Any suggestions would be greatly appreciated.

    Code:
    Ext.ns('Ext.d');
    Ext.d.MaterialTypeCharacteristicsPanel = Ext.extend(Ext.Panel,{
    	title:"Material Type Characteristics",													 
    	materialTypeId:-1,
    	supplierCompanyId:-1,
    	constructor:function(config) {
    		// constructor pre-processing - configure listeners here
    		config = config || {};
    		config.listeners = config.listeners || {};
    		Ext.applyIf(config.listeners, {
    			add:function(t,p) {console.log(p)},
    			 render:{scope:this, fn:function() {
    				this.store_materialTypeChars.load({
    					params:{material_type_id:this.materialTypeId,supplier_company_id:this.supplierCompanyId},
    					scope:this,
    					callback:function(records,options,success) {
    						var p=new Ext.Panel(
    							{
    							title:"TEST",
    							html:"TEST3",
    								listeners:{
    									render:function(){console.log("rendered")}	
    								}
    							}
    						)
    						this.add(p)
    						this.doLayout()
    					}
    	
    				}) 
    				this.add(new Ext.Panel({title:"TEST",html:"TEST2"}))
    				}
    			}
    	   });
    	   Ext.d.MaterialTypeCharacteristicsPanel.superclass.constructor.apply(this, arguments);
    	},
    
    	initComponent:function() {
    
    		var model_materialTypeChars=[
    			{name: 'type_id',type:'string'},
    			{name: 'char_id',type:'string'},
    			{name: 'char',type:'string'}
    		]
    		
    		this.store_materialTypeChars= new Ext.data.Store({
    			url: '/material/cfc/cfc_materials.cfc?method=get_material_type_chars_json',
    			reader: new Ext.data.CFJsonReader( model_materialTypeChars,null),
    			listeners : {
    				loadexception:function (s,o,response,e) {
    					Ext.get("err").update(response.responseText)
    				}
    			}
    		})
    		
    		var config = { 
    			title: this.title,
        		layout:'table',	  
    			autoWidth:true,
    			style:"width:100%",
    			defaults: {style:"padding:2px"},
    			layoutConfig: {columns: 3},
    			items:[{type:"xpanel",title:"TEST",html:"TEST1"}]
    			
    		};
    
    		Ext.apply(this, config);
            Ext.d.MaterialTypeCharacteristicsPanel.superclass.initComponent.apply(this, arguments);								
    	}
    													 
    })
    Ext.reg('materialtypecharpanel', Ext.d.MaterialTypeCharacteristicsPanel);

  2. #2
    Ext User zhegwood's Avatar
    Join Date
    Dec 2007
    Location
    Boulder, CO Suburbia (Lafayette)
    Posts
    388
    Vote Rating
    1
    zhegwood is on a distinguished road

      0  

    Default


    You're losing scope... Try this:

    Code:
    this.store_materialTypeChars.load({
    	params:{material_type_id:this.materialTypeId,supplier_company_id:this.supplierCompanyId},
    	scope:this,
    	callback:function(records,options,success) {
    		var p=new Ext.Panel({
    			title:"TEST",
    			html:"TEST3",
    			listeners:{
    				render:function(){console.log("rendered")}	
    			}
    		});
    		this.add(p);
    		this.doLayout();
    	}
    }, this);

  3. #3
    Ext JS Premium Member
    Join Date
    Mar 2008
    Location
    Canada
    Posts
    11
    Vote Rating
    0
    dweeres is on a distinguished road

      0  

    Default


    thanks zhegwood, I appreciate your response but unfortunately that did not do it.

    The problem is that it actually is being added to the parent panel, but it does not render it.

    I can tell that it is being added via the code: add:function(t,p) {console.log(p)},

    And not being rendered via your code:
    listeners:{render:function(){console.log("rendered")}}
    and that it does not show

    and other suggestions would be greatly appreciated.

  4. #4
    Ext JS Premium Member
    Join Date
    Mar 2008
    Location
    Canada
    Posts
    11
    Vote Rating
    0
    dweeres is on a distinguished road

      0  

    Default


    Ok I figured it out, sort of.

    The doLayout() is not calling the setLayout() properly, so basically replacing the doLayout() with

    this.getLayout().renderAll(this,this.getLayoutTarget())

    fixed the problem.

    Not sure why the doLayout does not work properly with the tablelayout after the inital render.

Thread Participants: 1

Turkiyenin en sevilen filmlerinin yer aldigi xnxx internet sitemiz olan ve porn sex tarzi bir site olan mobil porno izle sitemiz gercekten dillere destan bir durumda herkesin sevdigi bir site olarak tarihe gececege benziyor. Sitenin en belirgin ozelliklerinden birisi de Turkiyede gercekten kaliteli ve muntazam, duzenli porno izle siteleri olmamasidir. Bu yuzden iste. Ayrica en net goruntu kalitesine sahip adresinde yayinlanmaktadir. Mesela diğer sitelerimizden bahsedecek olursak, en iyi hd porno video arşivine sahip bir siteyiz. "The Best anal porn videos and slut anus, big asses movies set..." hd porno faketaxi