Greetings,

I have a very strange problem in presenting PDFS in panels using extjs4. What I am using:

I have a viewport. West region: a treepenel , and center: a tabpanel. By clicking each treenode, a new tab is created that holds the pdf document (using iframe). Now, when I first click a treenode a newly tab occupies the center section, but it is blank (no pdf is displayed). If a click a second treenode, a second tab is created and the correct pdf is displayed! Now, if I close the first tab (the blank one) and try to click again the treenode that is responsible for displaying that pdf, it is opening a new tab with the pdf in it. In general, if a close the fist tab (blank tab) and then click any treenode, the newly generated tabs will show the correct pdfs(only the first generated tab is the problem)!!!

Notice that I can’t use “id” in the iframe element because the tabs (the iframe is in them) are generated dynamically. As you already know you cannot use ids in components that might be instantiate many times in the app’s lifecycle (trying the create a component with duplicate id)

When I open firebug I see that the “src” that iframe uses to load the pdfs, is loaded with the correct link from the first treenode click. Notice firebug don’t show any error.

I need help on this. I don’t know what to do. It is bugging me I month now.
Below are code snippets from the controller and the view( that is responsible for displaying the pdfs):

The Controller:

Code:
if (itsModel === "new_releases" && !tab){

                                                  
  tab = tabPanel.add(pdfPanel);                                                   
      tabPanel.setActiveTab(tab);
                                                    
  var tata = tabPanel.getActiveTab();
      var centPane = tata.query('pdfcenter');
          var lastCentPane = centPane[centPane.length-1];
            //var lastCentPane = centPane[0];
                  var itsView = lastCentPane.items.items[0].autoEl;
                     var itsViewId = lastCentPane.items.items[0].id;
                                                                                                  
  itsView.src = itsSrc; 
  }
The View:

Code:
Ext.define('Ledger.view.membertab.PdfCenter', {

                  extend: 'Ext.panel.Panel',
                  alias: 'widget.pdfcenter',
                  
                  
                  items: {
                    xtype: 'box',
                    autoEl: { 
                                  tag: 'iframe',
                                  style: 'height: 100%; width: 100%; border: none',
                                  src: []
                    }
                  }
  });

Thanks