1. #1
    Sencha User
    Join Date
    Oct 2009
    Posts
    45
    Vote Rating
    1
    macdoug1 is on a distinguished road

      0  

    Default Unanswered: Dynamic tab generation

    Unanswered: Dynamic tab generation


    I'm having trouble getting something similar to the example working to do the tab generation. Anyway here is my situation: I have a menu that I have an image and a text link that need to be clickable and from this generate a new tab with contents. I've looked at the example on the examples page with the button that generates a closable tab which is what I want but unfortunately I can't seem to get this to work since I am new to the MVC pattern I can't seem to get a my hands on the tab panel that is in the app.js file. Can anyone help?

    Code:
       launch: function() {       var vp = Ext.create('Ext.container.Viewport', {
                 layout:'fit',
                     
                         items:[{
                             xtype:'tabpanel',
                             activeTab:0,
                             items:[{
                                 title:'Customer Portal',
                                 layout:'fit',
                                items:[{
                                    xtype:'tabpanel',
                                    activeTab: 0,
                                    id:'tabs',
                                        items:[{
                                            title:'Create a Ticket',
                                            id:'ct',
                                            layout: {
                                                type: 'vbox',
                                                align: 'center'
                                            },
                                            items:[{
                                                /*loader: {
                                                    url:'',
                                                    autoLoad:true,
                                                    renderer: 'html',
                                                    text: "Loading...",
                                                    timeout: 60 
                                                }*/
                                                
                                            }]
                                            
                                        },{
                                            title:'Ticket Status',
                                            html:'Coming soon!'
                                            /*loader: {
                                                    url:'',
                                                    autoLoad:true,
                                                    renderer: 'html',
                                                    text: "Loading...",
                                                    timeout: 60 
                                                }*/
                                        },{
                                            title:'Mission Control',
                                            xtype:'missionmenu'
    Code:
    items:[{
               xtype:'panel',
               header:false,
    
               width:'25%',
               items:[{
                   xtype:'imagecomponent',
                   autoEl:{
                       tag:'img',
                       src:'./images/terminal_logo.jpg',
                       height:118
                   },
                   listeners:{
                       render: function(c){
                           c.getEl().on('click', function(e) {
                               addTab(true);
                           },c);
                       }
                   }
    //html:'<img src="./images/terminal_logo.jpg" height="118"</a>',
    /*handler: function () {
                    addTab(true);
                },*/
    //action:'addTab'
               },{
                   html:'<a href="" ><img src="./images/_logo.jpg" height="118"</a>'
               }]
    I placed the code for the addTab(true) function outside the second items define but then I think I lose scope here and I can't seem to get my hands on anything. Anyway I was trying to put the function in the controller but I can't seem to get it to work. Does anyone have any suggestions?

  2. #2
    Ext JS Premium Member
    Join Date
    Nov 2009
    Location
    St Louis,MO
    Posts
    267
    Answers
    20
    Vote Rating
    18
    James Goddard will become famous soon enough James Goddard will become famous soon enough

      0  

    Default


    try:

    Ext.getCmp ('tabs').addTab (...

  3. #3
    Sencha User
    Join Date
    Oct 2009
    Posts
    45
    Vote Rating
    1
    macdoug1 is on a distinguished road

      0  

    Default I got it to work but a bit differently

    I got it to work but a bit differently


    I had to move the method into the same class and just use the Ext.getCmp('tabs') to return the component. This allowed me to then just add the tab to the function. Thanks for the suggestion it helped see the issue.

Thread Participants: 1

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