Adob​​e FlexでDataGridのDropDownListで選択した項目を設定するには？

Question

DataGridにDropDownListを描画しました。 My Datagridは2つの列で構成され、最初の列はItemの名前、2番目の列はDropDownList（その項目に割り当てるラベル）で構成されます。

データベースからラベル値をフェッチし、DropDownListにロードすることができます。

各行は、ラベルデータがロードされたアイテム名とDropDownListで構成されています。

私がしたいことは、それぞれのドロップダウンで、その特定のアイテムに関連付けられたラベルを表示することです。

マイフレックスコード：

<mx:DataGrid id="IdDgItemLabelDisp" left="10" right="10" top="39" bottom="10" dataProvider="{arrAllItem}"> 
<mx:columns> 
    <mx:DataGridColumn dataField="itemName" headerText="Item Name"/> 
    <mx:DataGridColumn headerStyleName="dataGridHeadingStyle" headerText="Label"> 
     <mx:itemRenderer> 
      <fx:Component> 
       <mx:HBox horizontalAlign="center"> 
        <fx:Script> 
         <![CDATA[ 
         ]]> 
        </fx:Script> 
        <s:DropDownList id="IdCmbItemLabel" dataProvider="{outerDocument.arrLabelCombo}" selectedItem="{outerDocument.arrLabelCombo.getItemAt(0)}">                
        </s:DropDownList> 
       </mx:HBox> 
      </fx:Component> 
     </mx:itemRenderer> 
    </mx:DataGridColumn> 
</mx:columns> 

Answer 1

あなたはarrAllItemで定義されている行データごとにdropdownでselectedItemをしたい場合は、ここでのソリューションです：

<?xml version="1.0"?> 
<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"> 
<fx:Script><![CDATA[ 
    import mx.collections.ArrayCollection; 
    [Bindable] 
    private var arrAllItem:ArrayCollection = new ArrayCollection([ 
     {itemName: "Laptop", quantity:1}, 
     {itemName: "Windows", quantity:2}, 
     {itemName: "Mac", quantity:3}, 
     {itemName: "Tablet", quantity:4} 
    ]); 
    [Bindable] 
    public var arrLabelCombo:ArrayCollection = new ArrayCollection([ 
     {label: "One", data: 1}, 
     {label: "Two", data: 2}, 
     {label: "Three", data: 3}, 
     {label: "Four", data: 4} 
    ]); 
    ]]></fx:Script> 
<mx:DataGrid id="IdDgItemLabelDisp" left="10" right="10" top="39" bottom="10" dataProvider="{arrAllItem}"> 
    <mx:columns> 
     <mx:DataGridColumn dataField="itemName" headerText="Item Name"/> 
     <mx:DataGridColumn headerStyleName="dataGridHeadingStyle" headerText="Label"> 
      <mx:itemRenderer> 
       <fx:Component> 
        <mx:HBox horizontalAlign="center"> 
         <fx:Script> 
         <![CDATA[ 
          override public function set data(value:Object):void 
          { 
           if(data != value) 
           { 
            super.data = value; 
           } 
          } 
          private function getSelectedItem(data:Object):Object 
          { 
           if (data) 
           { 
            for each(var item:Object in IdCmbItemLabel.dataProvider) 
            { 
             if(data.quantity == item.data) 
              return item; 
            } 
           } 
           return null; 
          } 
          ]]> 
         </fx:Script> 
         <s:DropDownList id="IdCmbItemLabel" dataProvider="{outerDocument.arrLabelCombo}" selectedItem="{getSelectedItem(data)}"> 
         </s:DropDownList> 
        </mx:HBox> 
       </fx:Component> 
      </mx:itemRenderer> 
     </mx:DataGridColumn> 
    </mx:columns> 
</mx:DataGrid> 
</s:Application>