Flex, Array, ArrayCollection
I was working on some Flex stuff this morning, and got hung up on a data binding problem.
Data binding is one of Flex’s strongest features. It lets you simply say “this value is bound to that”, so you can do something like have a label’s text be bound to a field in your data model, so that if the model changes, the view is updated automatically.
Here’s what I had done:
// ActionScript code
class MyFoo
{
var myItems:Array = new Array();
}
<!– MXML –>
<mx:List dataProvider=”{myFooInstance.myItems}”/>
I tried binding to both a ComboBox and a List. When I bound to the ComboBox, I could see the items in the myItems array when I dropped down the combo box, but they never showed up in the list.
Turns out the problem is that when you bind to an Array, you’re binding to the array field itself, not to the items in the array. If I’d created a new array and assigned it to myItems then the List would have populated, but because I was just adding items to the myItems array, they never showed up.
The solution is simple: Use an ArrayCollection instead of an Array. ArrayCollection is designed to be bound to.
December 1st, 2007 at 10:52 am
Yes it’s true ! And all Flex newbies have had this problem one time -;) If you want use Array, override push and pop functions in order to refresh the UI part but with ArrayCollection all is “automatic” !
June 3rd, 2009 at 2:01 pm
Sorry for exhuming an old post, and maybe it’s a bug in the new Flex version, but I’m a newbie and cannot understand why ArrayCollection properties don’t seem to be bound anymore :
In the following example, Label is never updated :(
import mx.collections.ArrayCollection;
[Bindable] public var array:ArrayCollection = new ArrayCollection([0,0]);
October 2nd, 2009 at 1:02 pm
Hello friend,
Label text value gets updated if an array collection gets updated. see below example.
October 27th, 2009 at 7:55 am
I have problem wich is probbably related to this “array thing”. I am newbee, and this is what I want to do.
1. I created RemoteObject, and get array of object from database.
2. I have resultHandler function that take information from this array of object, by extracting just certain attributes, and putting this in array wich is populated OK, i get trace result of this array. Problem is :
3. Now I am trying to Bind this array in getResultHandler function with dataProvider of repeater components. How can I bind this two components, or I need to use some kind of setter function … and if I do, any idea.
tx