Tips on MenuBar control and its dataProvider in flex

Suppose we have a MenuBar and its dataPovider as below.

<mx:MenuBar id=”myMenu” dataProvider=”{xmlLst}” labelField=”@label” itemClick=”fnItemClick(event)” />

<mx:XMLList id=”xmlLst”>
        <root label=”year”>
            <menuitem label=”2001″ enabled=”true”/>
            <menuitem label=”2002″ enabled=”false”/>
            <menuitem label=”2003″ enabled=”true”/>
            <menuitem label=”2004″ enabled=”false”/>
            <menuitem label=”2005″ enabled=”true”/>
        </root>
</mx:XMLList>

and the itemClick handler below
private function fnItemClick(event:MenuEvent):void
{
//code goes here on itemClick
}
Desc: The MenuBar displays the XMLList dataProvider with all the years as menuitems[because labelField="@label"], and has a handler for itemClick “fnItemClick”.

Now the tips..

1.To set enabled=true for the year 2002.
xmlLst.menuitem.(@label==”2002″).@enabled=true;
//this is like traversing the XMLList.
//this will reflect changes both to XMLList and MenuBar
2.To set for all enabled=true.
//here we got to traverse the XMLList and change the data.
for each(var xml:XML in xmlLst.menuitem)
{
 xml.@enabled=true; 
}
3.To set enabled=false for selected Item.
//in the itemClick handler use the below code
event.item.@enabled=false;

Things to remember:- while accessing attributes of XML we got to use ‘@’ before the attribute name, not neccessary if it is an Object.

Download code.

Note:- Examples or code you have seen on this blog so far are related to Flex 3 SDK.