PDA

View Full Version : how to get Object param of (tab listeners: activate)?



softball
27 May 2014, 6:42 PM
Dear?
activate have 2 param:(this, object),

if if add an objY:{aa:"001",bb:"002"} for tab item,
and pass as activate: function(tab,objY){}

how can I get objY.aa in the function.

I have tried as: objY.aa or objY['aa']
but it is not work.

I have problem in ext to get josn object.

thx




var tabs2 = Ext.create('Ext.tab.Panel',{
renderTo: document.body,
activeTab: 0,
width: 600,
height: 250,
plain: true,
margin:'0 10 0 80',
defaults :{
autoScroll: true,
bodyPadding: 10
},
items: [{
title: '?????',
listeners: {
activate: function(tab,objY){
alert(tab.title+objY);
}
},
html: "XXXX",
objY:{aa:"001",bb:"002"}
},{
title: 'Tabs DISABLE',
disabled: true
}
]
})

skirtle
27 May 2014, 7:33 PM
The second argument passed to an activate listener is an object containing the event options. It will not magically become some other object just because you happen to call it objY.

You've stored objY on the child item so it should just be this:


tab.objY.aa

softball
27 May 2014, 9:16 PM
Dear skirtle:
thx. it's Ok!

but,I have question?
it seem to use 1 fist param tabY ,not use 2rd param ObjY? does it?
SO, how to pass a Object in 2rd param , an how to use it?

By the way,if I also have tab1 ,Does it possible to get tab1.width?
thx.


var tab1 = Ext.createWidget('tabpanel', {
renderTo: 'tabXX',
width: 450,
activeTab: 0,
margin:'50 10 50 80',
defaults :{
bodyPadding: 10
},
items: [{
title: 'Tabs-1',
closable: true,
html:'Tabs-1 CONTENT?'
},{
title: 'Tabs-2',
closable: false,
html:'Tabs-2 CONTENT'
}]
});

skirtle
27 May 2014, 9:29 PM
The activate listener is just a callback function. You can't choose what arguments you want to be passed to a callback, they're determined by the code that invokes the callback. To pass extra information you'd either use function scope or a closure, depending on the circumstances.

You can see the two arguments that are passed in the docs:

http://docs.sencha.com/extjs/4.2.1/#!/api/Ext.AbstractComponent-event-activate

I don't know which language you've been using where the names of the function parameters determine their values but it's a million miles away from how JavaScript works. You have no chance of surviving ExtJS without a solid grounding in JavaScript.

softball
28 May 2014, 5:26 PM
Dear skirtle:
I'm sorry to describe it unclearly.

Q1.I know active is a function
activate( this, eOpts );
this ?maybe means the tab of itemID:"XT" itself.
eOpts ?the doc said it is an option Object.
so?how could I to use this option?


Q2.as the code below?
I have 2 tab:tab1 and tab2.
Does it possible to get tab1.width from itemID:"XT";
I just want to know how to control it like DOM.

THX




Ext.require('Ext.tab.*');
Ext.onReady(function(){
var tab1 = Ext.createWidget('tabpanel', {
renderTo: 'tabXX',
width: 450,
activeTab: 0,
margin:'50 10 50 80',
defaults :{
bodyPadding: 10
},
items: [{
title: 'Tabs-1',
itemID:"X1",
closable: true,
html:'Tabs-1 CONTENT?'
},{
title: 'Tabs-2',
itemID:"X2",
closable: false,
html:'Tabs-2 CONTENT'
}]
});

var tabs2 = Ext.create('Ext.tab.Panel',{
renderTo: document.body,
activeTab: 0,
width: 600,
height: 250,
plain: true,
margin:'0 10 0 80',
defaults :{
autoScroll: true,
bodyPadding: 10
},
items: [{
title: 'ACT',
itemID:"XT",
listeners: {
activate: function(tab,ObjectOptionX){
alert(tab.title+tab.objY.aa);
}
},
html: "XXXX",
objY:{aa:"001",bb:"002"}
},{
title: 'Tabs DISABLE',
itemID:"XC",
disabled: true
}
]
})
});