Accessing tabs from code

[apmlaszloacct]

Is there a way of iterating through the tabs within a tabbed pane?
My problem is that I have two tabbed panes, if I select a tab in one tabbed pane, I need the corresponding tab of the other tabbed pane to be deselected and disabled.

I imagined a function like this:

var tabNumber = 6;
function setTabs(selectedTab){
for (var i = 0; i < tabNumber; i++){
if (tabbar1.tabs[i] = selectedTab){
tabbar1.tabs[i].setAttribute('clickable', false);
tabbar1.tabs[i].setAttribute('enabled', false);
}
else {
tabbar1.tabs[i].setAttribute('clickable', true);
tabbar1.tabs[i].setAttribute('enabled', true);
}

}
}


I know this is pseudocode - but is it possible to do something like it?

Thanks Andrew

[pablo]

Hi Andrew,

You basically need to keep track of who was selected last. See if this works for you:


<canvas>

<class name="mytabpane" extends="tabpane">
<method event="oninit">
if (this.tab.selected) {
parent.setAttribute('lastSelectedTab', this.tab);
}
</method>

<method event="onselect" reference="this.tab">
if (this.tab.selected) {
var lst = parent.lastSelectedTab;
if (lst != null) {
lst.setAttribute('enabled', false);
lst.setAttribute('clickable', false);
}
parent.setAttribute('lastSelectedTab', this.tab);
}
</method>
</class>

<tabs>
<!-- keep track of last tab selected -->
<attribute name="lastSelectedTab" value="null" type="expression" />

<mytabpane text="one">
<view bgcolor="red" height="50" width="50" />
</mytabpane>
<mytabpane text="two">
<view bgcolor="green" height="50" width="50" />
</mytabpane>
<mytabpane text="three">
<view bgcolor="blue" height="50" width="50" />
</mytabpane>
<mytabpane text="four">
<view bgcolor="teal" height="50" width="50" />
</mytabpane>
</tabs>

</canvas>


Cheers,
pablo