The Web Squeeze: Flex/as3 Dynamic Combobox Class - The Web Squeeze

package com.lib
{ 
	import mx.collections.ArrayCollection;
	import mx.controls.Alert;
	import mx.controls.ComboBox;
	import mx.events.FlexEvent;
	import mx.events.ListEvent;
	import mx.rpc.events.FaultEvent;
	import mx.rpc.events.ResultEvent;
	import mx.rpc.http.HTTPService;
	
	import mx.utils.ObjectUtil;
	
	public class DynComboBox extends ComboBox
	{
		private var savedSelectedIndex:int;
		public var selectionChanged:Boolean = false;
		
		// stuff to get the data
		public var type:String;
		public var selected:String;
		
		[Bindable]
		private var fDataLoader:HTTPService = new HTTPService();
		private var params:Object = new Object();
		
		public function DynComboBox()
		{
			super();
			this.enabled = false;
			
			this.addEventListener(ListEvent.CHANGE, onChange);
			this.addEventListener(FlexEvent.CREATION_COMPLETE, getData);
		}
		
		private function getData(e:FlexEvent):void
		{
			this.removeEventListener(FlexEvent.CREATION_COMPLETE, getData);
			
			savedSelectedIndex = this.selectedIndex;
			
			// This gets the form data from the DB, such as the 
			// 50 states for instance
			fDataLoader.method = "POST";
			fDataLoader.url = "http://192.168.1.59/index.php/lib/formData";
			
			params.filter = type;
			fDataLoader.send(params);
			fDataLoader.addEventListener(ResultEvent.RESULT, fillComboBox);
			fDataLoader.addEventListener(FaultEvent.FAULT, fdlError);
		}
		
		private function fdlError(err:FaultEvent):void
		{
			Alert.show("Could not load form data");
		}
		
		public function fillComboBox(res:ResultEvent):void
		{
			// This works fine... takes the result and populates the ComboBox
			// with the data.
			var sts:ArrayCollection = res.result.root.formData as ArrayCollection;
			this.dataProvider = sts;
			this.enabled=true;
		}
		
		private function onChange(event:ListEvent):void
		{
			savedSelectedIndex = this.selectedIndex;
			
			// I have this commented, but it works. When you select an 
			// item from the ComboBox it alerts the correct data.
			//Alert.show(this.dataProvider[selectedIndex].data.toString());
		}
		
		public function set setIndex(si:String):void
		{
			/**
			 * Here's where I run into problems. When showing the 
			 * dataProvider I get an empty array.
			 * */
			Alert.show(ObjectUtil.toString(this.dataProvider));
		}
		
		override public function set dataProvider(dp:Object):void
		{
			this.selectedIndex = savedSelectedIndex;
		}
	}
}

this.dataProvider = sts;

Alert.show(ObjectUtil.toString(this.dataProvider));

Alert.show(this.dataProvider.toString());

Quote

Quote

Alert.show(this.dataProvider.toString());

import mx.utils.ObjectUtil

package com.lib
{ 
	import mx.collections.ArrayCollection;
	import mx.controls.Alert;
	import mx.controls.ComboBox;
	import mx.events.FlexEvent;
	import mx.rpc.events.FaultEvent;
	import mx.rpc.events.ResultEvent;
	import mx.rpc.http.HTTPService;
	
	public class DynComboBox extends ComboBox
	{
		public var type:String;
		public var selected:String;
		
		[Bindable]
		private var fDataLoader:HTTPService = new HTTPService();
		private var params:Object = new Object();
		
		public function DynComboBox()
		{
			super();
			this.enabled = false;
			
			this.addEventListener(FlexEvent.CREATION_COMPLETE, getData);
		}
		
		private function getData(e:FlexEvent):void
		{
			this.removeEventListener(FlexEvent.CREATION_COMPLETE, getData);
			
			// This url would be the path to the page that generates your data
			fDataLoader.url = parentApplication.config.serverLocation+"/lib/formData";
			fDataLoader.method = "POST";
			
			params.filter = type;
			fDataLoader.send(params);
			fDataLoader.addEventListener(ResultEvent.RESULT, fillComboBox);
			fDataLoader.addEventListener(FaultEvent.FAULT, fdlError);
		}
		
		private function fdlError(err:FaultEvent):void
		{
			Alert.show("Could not load form data");
		}
		
		private function fillComboBox(res:ResultEvent):void
		{
			var sts:ArrayCollection = res.result.root.formData as ArrayCollection;
			this.dataProvider = sts;
			
			this.enabled=true;
		}
		
		private function setIndex():void
		{
			if (this.dataProvider.length > 0)
			{
				for (var i:int; i<this.dataProvider.length; i++)
				{
					if (this.dataProvider[i].data.toString() == selected)
					{
						this.selectedIndex = i;
						break;
					}
				}
			}
		}
		
		override public function set dataProvider(dp:Object):void
		{
			super.dataProvider = dp;
			setIndex();
		}
	}
}