The following example shows how you can have multiple selected items in a List or DataGrid control at the same time. To select multiple items at once, hold down the Shift or Control keys on your keyboard while pressing the mouse button on a list item.
Full code after the jump.
<?xml version="1.0" encoding="utf-8"?>
<!-- http://blog.flexexamples.com/2007/11/21/allowing-multiple-selected-items-in-flex-list-and-datagrid-controls/ -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
layout="horizontal"
verticalAlign="middle"
backgroundColor="white">
<mx:Array id="arr">
<mx:Object col1="One.1" col2="One.2" col3="One.3" />
<mx:Object col1="Two.1" col2="Two.2" col3="Two.3" />
<mx:Object col1="Three.1" col2="Three.2" col3="Three.3" />
<mx:Object col1="Four.1" col2="Four.2" col3="Four.3" />
<mx:Object col1="Five.1" col2="Five.2" col3="Five.3" />
<mx:Object col1="Six.1" col2="Six.2" col3="Six.3" />
<mx:Object col1="Seven.1" col2="Seven.2" col3="Seven.3" />
<mx:Object col1="Eight.1" col2="Eight.2" col3="Eight.3" />
</mx:Array>
<mx:ApplicationControlBar dock="true">
<mx:Form styleName="plain">
<mx:FormItem label="allowMultipleSelection:">
<mx:CheckBox id="checkBox" selected="true" />
</mx:FormItem>
</mx:Form>
</mx:ApplicationControlBar>
<mx:List id="list"
allowMultipleSelection="{checkBox.selected}"
dataProvider="{arr}"
labelField="col1"
verticalScrollPolicy="on" />
<mx:DataGrid id="dataGrid"
allowMultipleSelection="{checkBox.selected}"
dataProvider="{arr}"
verticalScrollPolicy="on" />
</mx:Application>
View source is enabled in the following example.
how do you obtain the multiple selected through event on change?
i know u can get 1 object through
var selectedItem:Object=event.target.selectedItem;
how do u get all the objects that are selected?
Terence,
You can use the
selectedItemsproperty instead ofselectedItem.The
selectedItemsproperty returns an array of objects representing all the selected items.For more information, see the
selectedItemsproperty in the ListBase class in the Flex documentation.Hope that helps,
Peter
thank you. that worked :D
slt Peter,
juste une truc pour selectedItems c’est un array, c’est bien, mais comment je peut tester si une valeur string exist sur ce derniers?
merci d’avance pour ce site Peter :)
Reda Makhchan,
Sorry, I’m not sure I understand your question, but does this help?
<?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical" verticalAlign="middle" backgroundColor="white"> <mx:Script> <![CDATA[ import mx.controls.Alert; import mx.events.ListEvent; private function list_change(evt:ListEvent):void { var item:String = "Four"; var idx:int = list.selectedItems.indexOf(item); if (idx > -1) { Alert.show("Item was selected.", "index = " + idx); } else { Alert.show("Item was not selected."); } } ]]> </mx:Script> <mx:Array id="arr"> <mx:String>One</mx:String> <mx:String>Two</mx:String> <mx:String>Three</mx:String> <mx:String>Four</mx:String> <mx:String>Five</mx:String> <mx:String>Six</mx:String> <mx:String>Seven</mx:String> <mx:String>Eight</mx:String> </mx:Array> <mx:List id="list" allowMultipleSelection="true" dataProvider="{arr}" labelField="col1" verticalScrollPolicy="on" width="100" change="list_change(event);" /> </mx:Application>Peter
hello Peter,
Sorry I spoke french, well what I want to say is :
I’ve an two arrays :
…
…
the first is affacted to dataprovider in a grdLigne (allowmultiSelect = true)
so I can select ligne 11, ligne 12 … and I need to get the concerned value from a second array.
Ithink we get the selected value 1 by 1 with:
grdLigne.selectedItems[0].ligne,grdLigne.selectedItems[1].ligne …
and I need to filter that array by selected lignes (filterFunc):
…
arrCol2.filterFunction = processFilter;
…
private function processFilter(item:Object):Boolean {
//will not work
if(item.ligne == grdLigne.selectedItems.ligne)
return true;
else return false;
}
any idea?
that what I was talking about ;), sorry and thks in advance Peter
And About ‘IndexOf’ it works for a simple array yes, but I don’t think it works in this case :(
Thats swell (and easy), so how can you set more than one selected item using ActionScript?
Hey Peter,
I love this website, I use it almost everyday. 99% of the stuff on this you can’t find anywhere else. Thanks so much.
Peace,
Lance