1. #1
    Sencha - Community Support Team grgur's Avatar
    Join Date
    Aug 2007
    Location
    Split, Croatia
    Posts
    154
    Vote Rating
    24
    grgur has a spectacular aura about grgur has a spectacular aura about

      1  

    Default Replace component function

    Replace component function


    In case you need to replace a component with new one, here's the addition to AbstractContainer that will allow such action:

    Code:
    Ext.override(Ext.AbstractComponent, {
        replace: function(newCmp) {
            var 	oldCmp = this, 
    		parent = oldCmp.up(), 	//find the parent component
    		index;
    				
    	//find the exact position of the component that needs to be replaced
            parent.items.each(function(c,i) {if (c==oldCmp) index=i;});
    		
    	//remove the sucker
    	parent.remove(oldCmp, true);
    		
    	//add the new one
            newCmp = parent.insert(index, newCmp);
            
    	//refresh layout
            parent.doLayout();
    
    	//return the newly created component
            return newCmp;
        }
    });
    All you need to do is find the component you want to replace and - replace it:
    Code:
    Ext.getCmp('iNeedToBeReplaced').replace({xtype: 'panel',html:'I just replaced that old component'});
    Last edited by grgur; 26 May 2011 at 9:36 PM. Reason: returned cmp
    Grgur Grisogono
    Ext JS in Action SE co-author
    Exercising awesomeness at Modus Create - Official Sencha Partner

    Get in touch for Sencha Touch Training
    @ggrgur

  2. #2
    Sencha User
    Join Date
    Jan 2013
    Location
    Spain
    Posts
    6
    Vote Rating
    1
    iStan is on a distinguished road

      0  

    Default


    I created something similar.

    Code:
    Ext.override(Ext.Component, {
    Code:
        replaceCompoment: function(oldEle, newEle) {
                if (!oldEle || !newEle) { return; }
    
                var ownerCt = oldEle.ownerCt,
                    position = ownerCt.items.indexOf(oldEle);
    
                ownerCt.insert(position, newEle);
                ownerCt.remove(oldEle);
            }
        });


    Probably it can be improved, but for the moment it is doing it's job just fine.

  3. #3
    Sencha User makana's Avatar
    Join Date
    Apr 2008
    Location
    Dresden, Germany
    Posts
    526
    Vote Rating
    17
    makana has a spectacular aura about makana has a spectacular aura about

      1  

    Default


    Hi,

    thanks for your contribution.

    Just 2 cents:

    I personally do not prefer such methods on components that handle container stuff, because it implies that these components are within containers, and not floating or just rendered to dom. And it implies that components know their container, what is right since all have their ownerCt property, but what they do not need to know and IMO what we should not expect.

    I would rather prefer an extension to Ext.container.AbstractContainer called replaceChild(oldChild, newChild, autoDestroy) or something like that which of course handles the case that oldChild is not part of this container.
    Programming today is a race between software engineers striving to build bigger and better іdiot-proof programs, and the universe striving to produce bigger and better idiots. So far, the universe is winning. (Rick Cook)

    Enhanced ExtJS adapter for Adobe AIR

Thread Participants: 2

Tags for this Thread

film izle

hd film izle

film sitesi

takipci kazanma sitesi

takipci kazanma sitesi

güzel olan herşey

takipci alma sitesi

komik eğlenceli videolar