Hasan Otuome

Hasan Otuome is Chief Architect for Marx Media (http://www.marxmedia.net) where he can usually be found developing Rich Internet Applications for the company's clients. He champions creative uses and combinations of Flash, PHP, AJAX and MySQL, among others, for their benefits in user experience improvement.

View all articles by Hasan Otuome

Select your "actions" layer and open your actions panel. First thing we need to do is declare all the variables that we'll need in our code. Remember when I mentioned improving efficiency? Well, code organization definitely goes a long way to that end. Anyways, these are the variables we'll be using:

//create all the variables you'll need
 var i:Number;
 var nodes:Array = new Array();
 var states:Array = new Array();
 var stateDP:Array = new Array();

If you'll notice, the above code makes use of strict data-typing which basically means what it says. Take the variable i for example. Since I strict data-typed it to a number I can only assign numbers to it. This not only improves efficiency but it's also good programming practice.


Next, let's connect to our XML file we made earlier and call the function addStates once the file is successfully loaded

//setup your XML connection
 var sXML:XML = new XML();
 sXML.ignoreWhite = true;
 sXML.onLoad = addStates;
 sXML.load("states.xml");


Now we'll fill all those arrays that we declared earlier with the help of our other good friend, the for..next loop.

//let the fun begin
 function addStates(){
     //use the "nodes" array to refer to the xml kiddies 
     nodes = this.firstChild.childNodes;
     for (i=0; i<nodes.length; i++){
         //loop through "nodes" and add each "lbl" attribute to the "states" array
         states.push(nodes[i].attributes.lbl);
         //now fill the comboBox's data provider with the contents of the "states" array
         stateDP.addItem({label:states[i], data:states[i]});
     }
 }


Don't get me wrong. You could accomplish this without using all the arrays that I did and just constantly refer to the XML nodes directly but this approach is neater or easier to read which I think is also I criteria in improving efficiency.

Last, but not least, we'll populate our comboBox on the stage with our list of states.

//bind the comboBox to its data provider
 cmbState.dataProvider = stateDP;


And there you have it. Now, all you have to do is setup XML files and customize the look of your component. Try throwing 3 or 4 combos on the stage, each pulling data from different XML files. Starting to look like an application, don't you think? Enjoy!

Hasan
hasan at marxmedia dot net