PDA

View Full Version : Design Question - Tab activation with params



OliverT
28 Aug 2011, 11:50 PM
Hello,

I need to give some additional parameters to my applet.

This is how I did it:


Extended my tabpanel with a method


initTabWithParam: function(tabId, args) {
this.fireEvent('initTabWithParam', this, tabId, args);
}
and add a listener to the tabpanel


,listeners:{
,initTabWithParam : function( tabThis, tabID, appletTab) {
tabThis.setActiveTab(tabID);
this.get(tabID).add(new Ext.company.AppletPanel({activeTab:appletTab}));

}
}


Ext.company.AppletPanel.js:


Ext.company.AppletPanel = Ext.extend(Ext.Panel, {


activeTab:0
,width:100
,height:100
,user_id :0
,id:'AP'
,initComponent:function() {

Ext.company.AppletPanel.superclass.initComponent.apply(this, arguments);

} // eo function initComponent

,afterRender: function(ct) {

//@Todo use Xtemplate here...
Ext.company.AppletPanel.superclass.afterRender.apply(this, arguments);

var width = this.ownerCt.getWidth();
var height = this.ownerCt.getHeight();
var html = '<div id="kvonlineapplet">'
+ '<applet code="kvonlineapplet.MainApp.class"'
+ 'width="' + width + '"'
+ 'height="' + height + '"'
+ 'archive="KVOnlineApplet.jar" codebase="kvonlineapplet"'
+ 'type="application/x-java-applet;version=1.6">'
+ '<PARAM name="tab" value="' + this.activeTab + '"/>'
+ '<PARAM name="user_id" value="' + this.user_id + '" />'
+ '<PARAM name="session_id" value="' + this.sid + '"/>'
+ '</applet>'
+ '</div>';

this.el.update(html);
}

});


To reinstantiate the applet with other parameters, I had to remove it after the tab gets deactivated.

I added a listener to the tabitem:


listeners:{
add : function(ct){
ct.doLayout();
}
,deactivate : function(ct) {
ct.removeAll();
}
}


Is there a better/cleaner solution?

Thanks a lot for reading!

drian
29 Aug 2011, 9:48 PM
You can add another property when you set the active tab.

myNextTab.myCustomProperty = X;
setActiveTab(myNextTab);

To get myCustomProperty inside myNextTab object you use this.myCustomProperty.