This is my second day using FLEX and AS 3.0 so I am very new at this. I am trying to obtain the value of the selected item in a tree component, in this case it is just a name. Below is the tree I have created. The tree contents have been populated programmatically with an array called "cat". The tree gets populated just fine but I can't figure out how to get the name of the currently selected item.
<mx:Tree id="category_tree" x="10" y="80" width="160" height="169" showRoot="true" dataProvider="{cat}" labelField="name">
I have used the selectedItem.toString() function but this only seems to return the type of object and not the value. Currently it returns "object Object"
In my script I have...
category_tree.selectedItem.toString();
Any help on this would be greatly appreciated. Thank you in advance for your time.
You can add a change event to the tree and have use a callback similar to:
private function changeEvt(event:Event):void {
var lableData:*;
var label:String;
if (event.currentTarget.selectedItem.#data) {
labelData = event.currentTarget.selectedItem.#data;
}
label = event.currentTarget.selectedItem.#label;
}
}
or access the value directly
category_tree.selectedItem.#label;
Related
I have a view
<view:SampleDataGridView
rowCount="{Math.min(MAX_ROW_COUNT, hostComponent.dataList.length)}"
dataprovider="{hostComponent.dataList}"
buttonMode="true"
click="clickRow(event)"
/>
I want to get which row was clicked. I tried using currentTarget and target from event object however it wasn't of much use.
Is there a way I can pass some parameter in clickEvent function like clickEvent(rowData) or clickEvent(currentRowIndex)?
Is there any property when we use dataProvider to show currentIndex?
Data Grid
<mx:DataGrid id="employeeDataGrid" doubleClickEnabled="true" itemDoubleClick="selectEmployee(event);" dataProvider={employeeList} >
Handler
protected function selectEmployee(event:ListEvent):void
{
var selectedEmployee:Employee = event.currentTarget.selectedItem as Employee;
}
Is it possible to change the folder icon of a tree column in an AdvancedDataGrid based on the data of that row?
I have an AdvancedDataGrid that is displaying HierarchicalData (from XML data) in a tree format. I want to display a different icon for the folder icon based on the XML data for each row. The only obvious way to change the folder icons at all is to set the folderOpenIcon and folderClosedIcon properties of my AdvancedDataGrid, but that sets the folder icon for all rows. I tried using the AdvancedDataGrid function "setItemIcon", but that doesn't seem to work.
I have some ColumnRenderers in this AdvancedDataGrid that display different icons in other columns based on the row data, but I haven't found a way to do this with the main tree column. I'm guessing it would be similar to using a ColumnRenderer, but maybe using something like a GroupItemRenderer.
This should be possible via an groupIconFunction like this:
<mx:AdvancedDataGrid groupIconFunction="getGroupIcon">
<mx:columns>
<mx:AdvancedDataGridColumn headerText="Name" dataField="name"/>
</mx:columns>
</mx:AdvancedDataGrid>
<fx:Script>
[Embed(source='/assets/company.png')]
private static const COMPANY_ICON: Class;
[Embed(source='/assets/customer.png')]
private static const CUSTOMER_ICON: Class;
private function getGroupIcon(item:Object,depth:int):Class
{
if (item is Company)
return COMPANY_ICON;
if (item is Customer)
return CUSTOMER_ICON;
// null = default icon
return null;
}
</fx:Script>
There is also an example in Adobe's Flex online reference which demonstrates how to use the groupIconFunction and groupLabelFunction properties.
i have a list of songs and if I double click an Item, it will play the song. I do it like this. aList is the instance name of the list.
aList.addEventListener(MouseEvent.DOUBLE_CLICK, changeSong);
function changeSong(e:MouseEvent) {
....
song = e.target.selectedItem.data;
....
}
I have the error in the part of (song = e.target.selectedItem.data;) . It seems like i used a wrong property.
ReferenceError: Error #1069: Property selectedItem not found on fl.controls.listClasses.CellRenderer and there is no default value.
at playlist_fla::MainTimeline/changeSong()
Do anyone know how to properly get the item's data. Because I think my syntax is wrong.
Thanks in advance.
What have you assigned as the List component's dataProvider?
e.target.data is an object with additional properties.
If you're unsure of the properties of the data object, you can iterate thru one like this:
for (var property:String in data)
{
trace("data." + property + " = " + data[property]);
}
If it's the label of a standard itemRenderer that you are trying to assign to the song variable you're likely to succeed with:
song = e.target.listData.label;
I'm using an XMLListCollection for a spark ComboBox, inspired by this link
http://blog.shortfusion.com/index.cfm/2009/4/15/FlexAS3-Custom-ComboBox-for-Countries-with-XML
The XMLListCollection is defined here:
public class ComboBox_Country extends ComboBox {
private var Country:XML=new XML(
<countries>
<country code="US" iso="840" label="United States" />
<country code="CA" iso="124" label="Canada" />
<country code="GB" iso="826" label="United Kingdom" />
....
<country code="ZM" iso="894" label="Zambia" />
<country code="ZW" iso="716" label="Zimbabwe" />
</countries>);
public function ComboBox_Country() {
dataProvider = new XMLListCollection(Country.children());
labelField = '#label';
}
and called in mxml as:
<mycomp:ComboBox_Country id="countryComboBox" width="100%"/>
When the user makes a selection, I can get the index from: countryComboBox.selectedIndex. But, I need the string for the country, and I'm not sure how to extract that from an XMLListCollection. When I look in the debugger I see:
Let's say the user selected index 2 (e.g. United Kingdom). What would I need to type into the debugger to return United Kingdom? I've tried things like:
countryComboBox.Country.getItemAt(2)
countryComboBox.Country.getItemAt(2).label
countryComboBox.Country[2]
countryComboBox.Country.label.getItemAt(2)
etc...
to no avail.
ComboBox have a property selectedItem which you probably should use. In this case selectedItem would be XML object. Read how you can get data from XML objects here.
In your case you can get label using
countryComboBox.selectedItem.#label
I'm not entirely sure you populating the combo box correctly, normally you'd use a data provider (see http://help.adobe.com/en_US/flex/using/WS70f0d54f063b9b081aac8d1d1247252e4a0-8000.html)
Assuming that is displaying the data correctly for you, then you're pretty close
// Should give you the country object selected
var obj:Object = countryComboBox.selectedItem;
// You should also be able to use .code or .iso
return obj.label;
If obj.label doesn't work, you could try obj['label'];
A question about ItemRenderers: let's say I have an ArrayCollection that is my application data sitting inside a global object. I them populate a sparks list with this data, setting the ArrayCollection as the dataProvider.
So each ItemRenderer gets a copy of an item sitting in the array. You can override the "set data" method to set the data something more domain-specific. The problem is that the data is a copy of the original item.
Now let's say we want to add some data to the item while inside the ItemRender. For example, it could call a method on the item telling it to load some details about itself, or maybe we allow the user to modify something on the item.
Obviously, we can't do any of this if we are operating on a copy because it will be thrown away as soon as the ItemRenderer is destroyed and the original object doesn't know anything about what happened.
So what's the best practice? Should I just use the itemIndex of the renderer to pull out the original item from my global array like this:
{globalArrayCollection}.getItemAt(this.itemIndex)
But it seems kind of clunky to me. Is there a best practice for dealing with this?
Not sure I'm following but it sounds like you're looking for a way to get at your item renderer to set/change a value.
You could go about accessing a method on the renderer directly.
In your renderer:
public function setSomeValue(aValue:String):void{
someString = aValue;
}
You would also set the data on your ArrayCollection as well.
To access this method you would use this:
var dataGroup:DataGroup = list.dataGroup;
var itemRenderer:YourItemRenderer = dataGroup.getElementAt(list.selectedIndex) as YourItemRenderer;
itemRenderer.setSomeValue("string");
Hmm, why do you think that original ArrayCollection won't change if you change values in itemRenderer? For me this works and initial ArrayCollection changes.
[Bindable]
protected var model:Model;
override public function set data(value:Object):void
{
super.data = value;
this.model = value as Model;
}
protected function changeValue():void
{
model.value = "newValue";
}
Or am I misunderstood something?