1. #1
    Sencha User
    Join Date
    Mar 2012
    Posts
    16
    Vote Rating
    0
    raffael_epix is on a distinguished road

      0  

    Exclamation Unanswered: Add list to tab content dynamically

    Unanswered: Add list to tab content dynamically


    Hi!
    I want to add a Ext.List to a Ext.tab.Panel after the tabPanel has created.

    My code:
    TabPanel:
    Code:
    Ext.Viewport.add({
            	id: 'viewport',
                xtype: 'tabpanel',
                fullscreen: true,
                tabBarPosition: 'bottom',
    
    
                items: [
                    // This is the home page, just some simple html
                    {
                        title: 'Title',
                        iconCls: 'info',
                        cls: 'home',
                        html: [
    						'<br>',
    						'<div style="text-align:center;">',
                            '<img width=146 height=120 src="../logo.png" />',
    						'<br>',
                            '<h1>Title of App</h1>',
    						'</div>'
                        ].join("")
                    },
                    
                    {
                        title: 'List',
                        id: 'lista',
                        iconCls: 'bookmarks',
                        scrollable: true,
                        html: [
    						'<div id="lista">',
    						'<div style="text-align:center;"><br><br>Loading list...</div>',
    						'</div>'
                        ].join("")
                    }
    ...... CONTINUE .....
    My List:

    Code:
    var lista = Ext.create('Ext.List', {
    	    fullscreen: true,
    	
    	    store: {
    	        fields: ['name'],
    	        data: [
    	            {name: 'Cowper'},
    	            {name: 'Everett'},
    	            {name: 'University'},
    	            {name: 'Forest'}
    	        ]
    	    },
    	
    	    itemTpl: '{name}',
    	
    	    listeners: {
    	        select: function(view, record) {
    	            Ext.Msg.alert('Selected!', 'You selected ' + record.get('name'));
    	        }
    	    }
    	});
    I want to replace / add the content of the "list" item in tabPanel with the content of Ext.List created later in second code...

    Thanks!

  2. #2
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    37,651
    Vote Rating
    899
    Answers
    3575
    mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute

      0  

    Default


    You can use add or insert on the tab panel passing in your list.
    Mitchell Simoens @SenchaMitch
    Sencha Inc, Senior Forum Manager
    ________________
    Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
    https://github.com/mitchellsimoens

    Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/

    Need more help with your app? Hire Sencha Services services@sencha.com

    Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!

    When posting code, please use BBCode's CODE tags.

  3. #3
    Sencha User
    Join Date
    Mar 2012
    Posts
    16
    Vote Rating
    0
    raffael_epix is on a distinguished road

      0  

    Exclamation


    How I can do this? How I reference the tab panel?
    I have tried this:
    Code:
    //var lista = Ext.List.........
    Ext.get('lista').add(lista);
    Ext.getCmp('tabpanel_id').get('lista').add(lista);
    Quote Originally Posted by mitchellsimoens View Post
    You can use add or insert on the tab panel passing in your list.

Thread Participants: 1

Tags for this Thread