CODEWITHSUNDEEP
actionscript-3apache-flex
iman453
iman453

Reputation: 9535

Data binding to an array collection not working

I'm trying to make a CheckBox element visible based on whether a particular string exists in this bindable array collection I have, but it doesn't seem to work. I'd really appreciate it if someone can point out what I'm doing wrong.

In my actionscript code, I have 

[Bindable]private var dataTypesUsed:ArrayCollection = new ArrayCollection();

and in my flex code, I have

<s:CheckBox selected="true" label="test" id="testBox" visible="{dataTypesUsed.contains('Target')}" includeInLayout="{dataTypesUsed.contains('Target')}"/>

Upvotes: 0

Views: 980

Answers (1)

Sunil D.
Sunil D.

Reputation: 18193

The problem is that the contains() method of ArrayCollection is not [Bindable]. In MXML curly brace expressions, everything in the chain of properties must be [Bindable].

Normally, the Flex compiler will warn you when one of the properties in a curly brace expression is not [Bindable]. The warning is not generated when one of the properties is a function, by design I presume, as it can be a useful shortcut.

Functions can be marked as [Bindable]. As long as somewhere in the class that defines the function the "binding" event is dispatched. Take a look at the source code for ListCollectionView -- this is the class that actually defines the contains() method.

You'll see that the contains() method is not marked as [Bindable], and for contrast that the getItemAt() method is.

You can solve your problem a few different ways. Here's one that dispatches a custom binding event:

[Bindable("dataTypesUsedChanged")]
private var dataTypesUsed:ArrayCollection = new ArrayCollection();

private function someMethodThatUpdatesTheCollection():void
{
    dataTypesUsed.addItem("foo");
    // addItem will make the collection dispatch CollectionEvent.COLLECTION_CHANGE
    dispatchEvent(new Event("dataTypesUsedChanged")

}

<s:CheckBox visible={dataTypesUsed.contains('foo')} />

The difference is that when you don't specify the event name in the [Bindable] metadata, Flex uses the default "propertyChanged" event.

In your scenario, nothing was dispatching the "propertyChange" event to trigger binding (b/c the property literally did not change). In addition, the "collectionChange" event dispatched by the collection was not being used b/c the contains() method isn't marked as [Bindable].

Upvotes: 5

Related Questions