1. #1
    Sencha User
    Join Date
    Feb 2010
    Posts
    26
    Answers
    1
    Vote Rating
    0
    syl_via38 is on a distinguished road

      0  

    Default Unanswered: Problems with include components in tabpanel x-hide-display

    Unanswered: Problems with include components in tabpanel x-hide-display


    Hello,

    I have an application with a tabpanel in the center and when I click in menu, some tabs are opened. When I load html in these tabs, no problem it display, but I try to load extjs components and it doesn't work (nothing display)

    Example :

    //////////////// My principal tabpanel open a new tab ///////////////////
    tabPanel.add({
    id : 'tabRO',
    frame:false,
    border:false,
    autoShow:true,
    closable: true,
    closeAction:'destroy',
    html: Ext.get('exo').dom.innerHTML
    }).show();

    ///////////////////////// the component I want to include ///////////////////
    var passwordResetForm = new Ext.Panel({
    xtype: 'form',
    id: 'password-reset-form',
    labelWidth: 150,
    renderTo:'myPan',
    bodyStyle: 'padding:15px;background:transparent',
    border: false,
    //url: widgetURL,
    items: [
    {
    xtype: 'textfield',
    id: 'username',
    fieldLabel: 'Username',
    name: 'x01',
    allowBlank: false,
    minLength: 3,
    maxLength: 64,
    msgTarget: 'under',
    anchor: '90%'
    },

    //////////////// the div ///////////////////////
    <div id="exo" class="x-hide-display">
    <div id="myPan"></div>
    </div>

    If I remove x-hide-display, it works but it printed two time in my page.

    Please, someone have a idea for my mistake ?

    Thanks
    Sylvia From Bordeaux

  2. #2
    Sencha User
    Join Date
    May 2011
    Location
    Ukraine, Rivne
    Posts
    247
    Answers
    44
    Vote Rating
    42
    redraid has a spectacular aura about redraid has a spectacular aura about redraid has a spectacular aura about

      0  

    Default


    remove "html: Ext.get('exo').dom.innerHTML" from tabPanel and "renderTo:'myPan'" from
    passwordResetForm



    Use add() method to add components:
    PHP Code:
    ...create passwordResetForm
    tabPanel
    .suspendLayout true;
    tabPanel.add(passwordResetForm);
    tabPanel.suspendLayout false;
    tabPanel.doLayout(); 

  3. #3
    Sencha User
    Join Date
    Feb 2010
    Posts
    26
    Answers
    1
    Vote Rating
    0
    syl_via38 is on a distinguished road

      0  

    Default


    Thanks a lot for your answer.
    In fact, I already had this solution but I woul'd like to mix html divs and extjs components It's why I call div 'exo' like that for example :

    <div id="exo" class="x-hide-display">
    <div id=text> CHANGE PASSWORD </div>
    <div id="myPan"></div>
    <div id=text> Others html things </div>
    </div>

    So, I suppose that I have to add each div in separate tabPanel Item no ?

    Thanks

Thread Participants: 1