Search Flex Components Free

Custom Search

July 6, 2009

Flex Associative Arrays

In this example I will be showing the use of associative array to change the content of a DataGrid control. Associative arrays work just like regular arrays except they use an Object (normally a string) as their index. For example, inventory['price'] = 12.99. I will be creating an associative array of ArrayCollections. Each of these ArrayCollections will be used to populate a DataGrid.

First let's create the ComboBox and the DataGrid controls:



Now let's look at the code used in these examples. Comments are provided throughout the code.

import mx.collections.ArrayCollection;

//Array for the ComboBox control
private var categories:ArrayCollection =
new ArrayCollection(["Search", "News"]);

//Array collections to be placed in the Associative Array
private var searchList:ArrayCollection = new ArrayCollection([
{name:'Ask', url:''}]);

private var newsList:ArrayCollection = new ArrayCollection([
{name:'CNN', url:''},
{name:'Yahoo News', url:''},
{name:'CNet', url:''}]);

//Associative Array
private var allLists:Array = new Array();

//Intialization of the Associative array
//to be called on applicationComplete event
private function loadAllLists():void {

allLists['Search'] = searchList;
allLists['News'] = newsList;

//Event handler for the change event
private function changeCBHandler():void {
var category:String = cbCategory.selectedLabel;
dgSites.dataProvider = allLists[category];

Here is the complete application. Right click to see the complete source code.

Related Flex Tutorials