Results 1 to 2 of 2

Thread: TabPanel and AutoTabs: dynamically loading tabs is a problem for me...

  1. #1
    Ext User
    Join Date
    Aug 2010
    Vote Rating

    Default TabPanel and AutoTabs: dynamically loading tabs is a problem for me...

    Hello fellow Extjsers,

    I have some problems with the tabpanel; but let me first explain the background.

    I am currently integrating zend framework and extjs in such a way that:
    a) the global page layout - a border layout - is defined for once and for all in a zend layout
    b) each view is independant, so I can use html views without having to care about the global layout.

    The views are loaded in the center region of my global layout. This center region is a tabpanel.
    It is defined as follows:
            innercontentPanel = new Ext.TabPanel({    
                defaults: {             
                border: false,
                id: 'innercontentPanel',
                activeTab: 0,
                deferredRender: false,
                autoTabs: true
    Now, you see I've set autoTabs to true so that everytime it see a x-tab class in my "innercontent" div, it turns it into a tab. Works perfectly.
    Now my problem. When I change the page (in ajax), in fact, I get a whole new html view through my ajax query and then I do this:
    In this htmlreponse I get, I receive a series of divs with x-tab classes; so this makes new tabs in the end.

    Typically, I send things like this back in htmlresponse:
    <div class="x-tab" title="Pure text tab">
    <p>This is just text, and if you see this, it's working alright.</p>
    <div class="x-tab" title="Another tab">
        <div id="editor-grid"></div>
    ...but as you can guess from this view, it is sometimes more than just html; sometimes too, there is a <script type="text/javascript"> inside the response with its own extjs object creation. In the example above, notice the second tab called "Another tab": it has an empty div inside (editor grid); well, the view is sent with the script for creating an editor grid in this case (didn't post it, would be too long, but you get the idea: html tabs are sent with some extjs object definition).

    Now to the problem:
    The object inside the tabs renders badly; let's continue with the example above; so I do readTabs, and it creates my tabs; then I do activate(0), it activates the second tab; then I check my tabs manually, and I click on the second tab; here is what I see:

    The grid, which also has a tbar, renders badly; now, same example, but this time I do activate(1) after readTabs (so I activates the second tab directly); surprise, it work as intended:

    The grid and the tbar show correctly.

    My problem is thus that to render a tab correctly, I have to activate that particular tab. But I can't say in advance which tab will contain an extjs object; I want to always activate the first tab - seems logical - and when switching to the second, well its content shouldn't be messed up.

    It's really hard for me to explain the bug, but I went through this detailled description so that someone might be able to understand the problem.

    Hoping for some answers,
    Thanks in advance.

    Another - you guessed it - extjs beginner

  2. #2
    Sencha User
    Join Date
    Nov 2012
    Vote Rating

    Default --> autoTabs is not working while migrating 3.4 to 4.0.7

    Hi Sencha,

    I am migrating 3.4 to 4.0.7 Here what should i replace for autoTabs config(extjs 3) in extjs 4.

    Ext.create('',{ autoTabs: true, // In Extjs 4 ??
    activeTab: 0,
    deferredRender: false,
    border: false,
    html: helpText});
    If i placed question in wrong place kindly tell me where i have to place this...

Similar Threads

  1. Howto Add/Remove (dynamically) Tabs from TabPanel
    By Markj in forum Ext 2.x: Help & Discussion
    Replies: 11
    Last Post: 9 Dec 2009, 10:42 PM
  2. How to dynamically add tabs to TabPanel example by Saki
    By jsakalos in forum Community Discussion
    Replies: 0
    Last Post: 13 Mar 2009, 4:58 AM
  3. Problems with dynamically loading tabPanel
    By randomuser01 in forum Ext 2.x: Help & Discussion
    Replies: 4
    Last Post: 21 Oct 2008, 7:32 AM
  4. Dynamically adding tabs to TabPanel
    By OriginalCopy in forum Ext 2.x: Help & Discussion
    Replies: 16
    Last Post: 30 Apr 2008, 12:39 PM
  5. Dynamically loading tabs from database records
    By cindiv30 in forum Ext 2.x: Help & Discussion
    Replies: 0
    Last Post: 10 Mar 2008, 5:46 AM

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts