How to set selectedIndex of a DropDownList bound to a DataGrid

Question

Hello I'm a newbie.
Here my problem:
I've two kind of objects, named Persona and Email. Persona has a one to many  relation with Email object.
Persona is displayed in a DataGrid.
Cliccking a row (a Persona item), I need to display all related emails in a  DropDownList. I also want to display the first email automatically  (selectIndex=0).
It works for the first row.
Then, after the first row, I click the second row. It loads the related  emails correctly but doesn't not display the first email automatically, I have  to click on the dropdwonlist and choose it. If I want to see the first email  automatically, I need to click the second row twice. But now, going back to the  first row, it loads the related emails, but doesn't display the first one  automatically.
Can anyone suggest me where is the problem?
Follows my code:
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx"  minWidth="955" minHeight="600"  applicationComplete="ps.getPersonas()">
<fx:Script><![CDATA[ import mx.collections.ArrayCollection;
import mx.controls.Alert;
import mx.rpc.events.ResultEvent;
import spark.events.IndexChangeEvent;
[Bindable]
private var persone:ArrayCollection = new ArrayCollection();
private function getPersonas_resultHandler(event:ResultEvent):void
persone = event.result as ArrayCollection;
private function aggiornaDropDown(event:MouseEvent):void
Alert.show(dd.selectedIndex.toString());
dd.selectedIndex=0;
dd.dataProvider = dg.selectedItem.emails;
dd.labelField= "address";
]]>
</fx:Script>
<fx:Declarations> <s:RemoteObject id="ps" destination="provaService"  endpoint="http://localhost:8400/FlexSpringServer/messagebroker/amf">
<s:method name="getPersonas" result="getPersonas_resultHandler(event)" />
</s:RemoteObject>
</fx:Declarations> <mx:DataGrid x="138" y="126" id="dg" dataProvider="{persone}"  click="aggiornaDropDown(event)">
<mx:columns>
<mx:DataGridColumn headerText="ID" dataField="id"/>
<mx:DataGridColumn headerText="Nome" dataField="nome"/>
<mx:DataGridColumn headerText="Cognome" dataField="cognome"/>
</mx:columns>
</mx:DataGrid>
<s:DropDownList x="545" y="201" id="dd"/>
</s:Application>
I also tried to set the selectIndex attribute to 0 inside the DroipDownList  tag, but I couldn't solve the problem.
Thank you
Paolo

Answer 1

Hello.
I'm sorry but because I'm a newbie your question is not clear.
I wrote the code already included above and two AS valueobjects related to Persona and Email objects.
No more else.
Do I have to write a "renderer". Could you please clarify your question?
I attach new updates to my code but the problem is not solved.
Thank you
Paolo
<?xml version="1.0" encoding="utf-8"?>
<s:Application 
xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="
library://ns.adobe.com/flex/spark" xmlns:mx="
library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600" applicationComplete="ps.getPersonas()" backgroundColor="#F4F384">
<fx:Script>
<![CDATA[
import mx.collections.ArrayCollection; 
import mx.controls.Alert; 
import mx.events.ListEvent; 
import mx.rpc.events.ResultEvent; 
Bindable] 
private var persone:ArrayCollection = new ArrayCollection();[
Bindable] 
private var emails:ArrayCollection = new ArrayCollection(); 
private function aggiornaDropDown(event:Event):void
var persona:Persona = new Persona();persona = dg.selectedItem
as Persona;ps.getPersonaEmails(persona);
private function getEmails_Handler(event:ResultEvent):void
emails = event.result
as ArrayCollection;dd.selectedItem = emails.getItemAt(0); //dd.selectedIndex = 0 also doesn't work
]]>
</fx:Script>
<fx:Declarations>
<s:RemoteObject id="ps" destination="ProvaService" endpoint="http://localhost:8400/FlexSpringServer/messagebroker/amf">
<s:method name="getPersonas"/>
<s:method name="getPersonaEmails" result="getEmails_Handler(event)"/>
</s:RemoteObject>
</fx:Declarations>
 <s:Panel x="23" y="42" width="505" height="263" title="Contatti">
 <s:controlBarContent>
 </s:controlBarContent>
 <mx:DataGrid x="42" y="26" id="dg" dataProvider="{ps.getPersonas.lastResult}" click="aggiornaDropDown(event)">
 <mx:columns>
 <mx:DataGridColumn headerText="ID" dataField="id"/>
 <mx:DataGridColumn headerText="Nome" dataField="nome"/>
 <mx:DataGridColumn headerText="Cognome" dataField="cognome"/>
 </mx:columns>
 </mx:DataGrid>
 </s:Panel>
 <s:Panel x="27" y="321" width="501" height="269" title="Dettagli contatti">
 <s:VGroup x="45" y="10" width="200" height="200">
 <s:HGroup width="150" height="20">
 <s:Label text="Nome:"/>
 <s:Label text="{dg.selectedItem.nome}" paddingLeft="23"/>
 </s:HGroup>
 <s:HGroup x="45" y="36" width="150" height="22">
 <s:Label text="Cognome:"/>
 <s:Label text="{dg.selectedItem.cognome}"/>
 </s:HGroup>
 <s:HGroup x="45" y="70" width="200" height="118">
 <s:Label text="Emails:" paddingTop="5"/>
 <s:DropDownList id="dd" dataProvider="{emails}" labelField="address"/>
 </s:HGroup>
 </s:VGroup>
 </s:Panel>
 <s:Label x="65" y="10" text="Rubrica" fontSize="33" fontWeight="bold" color="#162ABF"/></s:Application>