Solved

How do I loop through ItemRenderers in a custom ComboBox?

Posted on 2009-05-12
5
2,616 Views
Last Modified: 2013-11-11
I have a custom ComboBox component where each item consists of a checkbox and a label. I need to be able to clear all selected checkboxes when needed, but I can't figure out how to access the ItemRenderers when looping through the list of selected items.
public function deselectAll( ):void

{

    	for( var i in selectedItems )

    	{

    	       // what do I do here?

    	}

}

Open in new window

0
Comment
Question by:eCat12
  • 2
  • 2
5 Comments
 
LVL 10

Expert Comment

by:mplord
ID: 24373031
The best way to do this is to think in terms of manipulating the data that the combobox and itemrenderers are presenting, rather than manipulating the GUI directly to alter the data.

To explain, you presumably provide an ArrayCollection or XMLList to the Combobox dataprovider.
Each item should have a property related to whether it is 'selected' or otherwise.
Your itemrenderer checkbox state should be data-bound to the 'selected' property.

This way if the user changes the state of a checkbox by clicking, the underlying 'selected' property for that item data is updated according to the checkbox state.

Clearing checkboxes is then a simple case of iterating through the dataprovider items to clear the 'selected' property, instead of trying to manipulate the data through the GUI as a user would.
0
 
LVL 37

Expert Comment

by:zzynx
ID: 24374834
>> I can't figure out how to access the ItemRenderers
Don't try to look for itemrenderer*S*.
There's only ONE itemrenderer that renders all the items in your combo box.

You should indeed simply iterate through all the items in your combo box's dataprovider and reset property 'X' to false or 0 or whatever.
Property 'X' is the property that corresponds with a selected checkbox in your itemrenderer.
0
 

Author Comment

by:eCat12
ID: 24377608
Thanks for the replies. I looped through the items in the dataProvider and set the selected property of each item to false, but the checkboxes still remain checked until I close the combobox and re-open it. How do bind this value to the checkbox's state?
0
 
LVL 10

Accepted Solution

by:
mplord earned 100 total points
ID: 24380171
This can be tricky with Checkboxes - here's an example.
In this case, the source property 'checked' is a string "true" or "false", where the Checkbox 'selected' property requires boolean true/false, so there's some translation between the two types going on here.


<?xml version="1.0" encoding="utf-8"?>

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
 

	<mx:Script>

		<![CDATA[

			[Bindable] public var model:XML = 

				<items>

					<person name="Fred" checked="true"/>

					<person name="Jim" checked="false"/>

					<person name="Bill" checked="false"/>

					<person name="John" checked="false"/>

				</items>

				

			private function onClear(event:Event):void

			{

				for each (var node:XML in combo.dataProvider)

					node.@checked = "false";

			}

			

		]]>

	</mx:Script>
 

	<mx:VBox verticalCenter="0" horizontalCenter="0" horizontalAlign="center">

		<mx:ComboBox id="combo" labelField="@name" dataProvider="{model.person}">

			<mx:itemRenderer>

				<mx:Component>

					<mx:CheckBox label="test" width="100%" change="cbChange(event);" creationComplete="init();">

						<mx:Script>

						<![CDATA[

							import mx.binding.utils.BindingUtils;
 

							private function init():void

							{

								BindingUtils.bindProperty(this, "selected", this, "checked");

								this.label = data.@name;

							}

						

							[Bindable] public function get checked():Boolean

							{

								return (data.@checked=="true")?true:false;

							}

							

							public function set checked(state:Boolean):void

							{

								data.@checked = state?"true":"false";

							}

						

							private function cbChange(event:Event):void

							{

								checked = this.selected;

								event.stopPropagation();

							}

						]]>

					</mx:Script>

						

					</mx:CheckBox>

				</mx:Component>

				

			</mx:itemRenderer>

		</mx:ComboBox>

		<mx:Button label="Clear" click="onClear(event);"/>

	</mx:VBox>

	

</mx:Application>

Open in new window

0
 

Author Comment

by:eCat12
ID: 24399465
Thank you!! I've got it now. :)
0

Featured Post

Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

I come across a lot of question about how to access things in the document class from a movieclip, or accessing something from a movieclip in the document class. It took me a while to figure this out but once I did it makes life so much easier. …
I have been doing hardcore actionscripting for some time; and needless to say I have faced a lot of problems in just understanding others' code rather than understanding what the code executes. A programmer's life can become hell when there are a lo…
In this tutorial viewers will learn how to create a basic motion tween animation in Flash Open a new document in Flash: Draw/import an image: Press CTRL + F8 to convert it into a graphic symbol: Select a frame (how long you want the tween to last): …
The goal of the tutorial is to teach the user how to live broadcast using Flash Media Live Encoder and connecting it to YouTube to broadcast. Log into your Youtube account, choose live stream settings, start live stream from Flash Media Live Enc…

895 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

16 Experts available now in Live!

Get 1:1 Help Now