How do I update the data for a panel within a tab panel?

[NMFord]

EDIT: I figured out the answer, I'm still new to this whole controller references schpangle and hadn't made a reference to the panel!!!

Hey guys,

How do I go about updating the data for a panel within a tab panel?

Here is the code that I am trying in my controller function (which isn't working, it tells me setData an undefined function, I assume that's because I'm trying to call the method incorrectly).

displayGene: function (jsonData, query, ret) {
        var geneView = this.getGeneView();
        geneView.geneTab.setData(jsonData.gene_info[0]);
        Ext.Viewport.animateActiveItem(geneView, this.slideLeftTransition);
},

I do have a version of the app in Touch 1.1 that works perfectly, and this particular line in that app looks like this:

BioGene.views.geneView.geneTab.update(jsonData.gene_info[0]);

I am really having some difficulties on migrating my code over to the new version and I've been having to rewrite my classes completely. I just can't figure out how to update the darn data on the panel!

Here is the code for the GeneView, and it is the geneTab's data I am trying to update.

Ext.define("BioGene.view.GeneView", {
    extend: "Ext.tab.Panel",
    alias: "widget.geneview",
    
    requires: [
        'Ext.tab.Panel'
    ],
    
    config: {
        fullscreen: true,
        tabBar: {
            layout: {
                pack: 'left',
                align: 'left'
            },
            docked: 'bottom'
        }
    },
    
    initialize: function () {
    
        this.callParent(arguments);
        
        // Button for returning to search listing
        this.backButton = new Ext.Button({
            text: 'Results',
            ui: 'back',
            handler: this.backToSearch
        });
        
        // Button for returning to search index
        this.searchButton = new Ext.Button({
            text: 'Search',
            ui: 'back',
            handler: this.backToIndex
        });

        // Top toolbar
        this.topToolbar = new Ext.Toolbar({
            title: 'Gene Display',
            docked: 'top',
            items: [
                this.backButton,
                this.searchButton
            ]
        });
        
        this.geneTab = {
            title: 'Gene',
            xtype: 'panel',
            id: 'geneTab',
            iconCls: 'info',
            iconMask: true,
            scrollable: true,
            styleHtmlContent: true,
            data: {
                gene_symbol: 'testing'
            },
            tpl: new Ext.XTemplate(
                        'roar {gene_symbol}'
            )
        };
        
        this.functionTab = {
            title: 'Function',
            xtype: 'panel',
            id: 'functionTab',
            iconCls: 'bookmarks',
            iconMask: true,
            scrollable: true,
            styleHtmlContent: true,
            html: 'roarrrrr'
        };
        
        this.add([this.topToolbar,this.geneTab,this.functionTab]);

    },
    
    backToIndex: function () {
        this.fireEvent("indexReturn", this);
    },
    
    backToSearch: function () {
        this.fireEvent("searchReturn", this);
    }
    
});

Would appreciate any help, thanks