Hi,

I have a tabpanel with dynamic panels attached to each tab of the tabpanel. Dynamic panel are attached related to information in a list. Each time I modified a row in the list, I display the tappanel with the right tabs. To do that here is the code I'm using to remove previous panel in the tabpanel and the code I'm used to attach new panels in tabpanel :



PHP Code:
var Selection Ext.getCmp("PartnerList").getSelectionModel().getSelections();
                if(
Selection.length == 1) {
                
                    
// Remove existing tabs
                    
partnerTabPanel.items.each(function(item) {
                        
partnerTabPanel.removeAll(false);
                        
console.log('remove tabpartner: '+item.id);
                         
item.cascade(function(item) {
                            
item.remove();
                            
console.log('component: '+item.id);
                            
comp Ext.getCmp(item.id);
                            
comp.removeAll(false); 
                        }) 
                    });
                
                    
// Create new tabs
                    
var syntaxPanel Ext.getCmp('partner' Selection[0].get('SYNTAX') + 'Id');
                    
console.log('syntax Panel Id : ' syntaxPanel);
                    if(!
syntaxPanel) { 
                        
partnerTabPanel.add('partner' Selection[0].get('SYNTAX') + 'Id');
                    }
                    
partnerTabPanel.add('partner' Selection[0].get('TMECH') + 'Id');
                    
partnerTabPanel.add('partnerRetryId');
                    
partnerTabPanel.setActiveTab(0);     
                    
partnerTabPanel.doLayout();
                    
partnerItem.setTitle('Trading Partner ' Selection[0].get('NAME'));
                
                    
// Load data
                    
partnerItem.getForm().load({
                        
url:'partner_read_db.php',
                        
params:{action:'readitem',table:'partner',id:Selection[0].get('TX_INDEX')},
                        
success : function(form,action) { eP.expand();},
                        
failure : function(form,action) { PartnerItemAnswer(action);}
                    }); 
Here is my definition of some of panels and my tabpanel definition.
PHP Code:
var partnerEmailPanel = new Ext.Panel ({
    
id'partnerEMAILId',
    
title'Email',
    
labelWidth150,
    
defaultType'textfield',
    
layout'form',
    
bodyStyle:'padding:10px 10px 10px 10px',
    
items: [
        { 
fieldLabel'Email field',    name'email:XXXX',    allowBlank:true}
    ]
});
var 
partnerAnsiX12Panel = new Ext.Panel ({
    
id'partnerANSIX12Id',
    
title'AnsiX12',
    
labelWidth150,
    
defaultType'textfield',
    
layout'form',
    
bodyStyle:'padding:10px 10px 10px 10px',
    
items: [
        { 
fieldLabel'ansiX12 field',    name'ansi:XXXX',    allowBlank:true}
    ]
});

var 
partnerTabPanel = new Ext.TabPanel({
    
activeTab 0,
    
id 'partnerTabPanel',
    
bodyStyle:'padding:10px 10px 10px 10px',
    
defaults:{ autoScroll:true},
    
animScrolltrue,
    
autoScrolltrue
    
layoutOnTabChangetrue,
    
width:500,
    
height:500
}); 
The first time everything is working well, panel are display correctly in my tabpanel. I can switch from one to another without issue. But after that, when I select a new row in my list, tabpanel becomes mad, it displays wrong panel in wrong tab. I don't understand why. Can somebody can help me, I really not understand why that's not working especially because that's works the first time.

Thanks you
Riquier