Dynamically fill comboBox providers in Flex Datagrid

Question

I am trying to dynamically add comboBox's to a DataGrid, and for each comboBox I expect a unique dataProvider. So for example I have built a grid as follows:

<s:DataGrid id="testGrid"
            horizontalCenter="0"
            width="100%"
            dataProvider="{testArr}"
            gridClick="handleTestGridClick(event)">
    <s:columns>
        <s:ArrayList>
            <s:GridColumn dataField = "valName" headerText="Name"/>
            <s:GridColumn dataField = "testVals" headerText="Selections>
                <s:itemRenderer>
                    <fx:Component>
                        <s:GridItemRenderer>
                            <s:ComboBox id="foo" width="300" dataProvider="{data.testVals}"/>
                        <s:GridItemRendeder>
                    </fx:Component>
                </s:itemRenderer>
        </s:ArrayList>
    </s:columns>
</s:DataGrid>

In my actionscript I have an HTTPService function that returns JSON data formatted in the following way:

my $store = { "valName"  => $$data[$i][0], #a string
              "testVals" => [@arr]} #array of strings

The result handler from the HTTPService:

private function handleResults(event:ResultEvent):void
{
   var str:String = String(event.result);
   var temp:Object = JSON.parse(str);
   testArr = new ArrayCollection(ArrayUtil.toArray(temp));
}

When I attempt to fill the grid the first column(s) will display the "valName"(s) I expect but the comboBox(es) remains empty. Using the gridClick event to display a selected row's dataProvider presents the following (note this changes depending on my provider, but always shows the correct data):

(Object)#0
  testVals=(Array)#1
   [0] "test1"
   [1] "test2"
  valName = "Blah"

Can anyone provide me with some tips,feedback, etc on how to get the testVal array to actually show up in the comboBox?

Philarmon Philarmon · Accepted Answer · 2015-05-20T14:35:15

Not sure how you are not getting an exception here but the testVals property should be an ArrayCollection to become a dataprovider and not an Array ?

Try this, I'm pretty sure it should work:

var itemOne:Object = {};
itemOne.valName = "Item one";
itemOne.testVals = new ArrayCollection(["one", "two"]);

var itemTwo:Object = {};
itemTwo.valName = "Item two";
itemTwo.testVals = new ArrayCollection(["three", "four"]);

testArr = new ArrayCollection([itemOne, itemTwo]);

So basically, you'd just need to convert all testVals from Array to ArrayCollection after you have got your data:

private function handleResults(event:ResultEvent):void
{
   var str:String = String(event.result);
   var temp:Object = JSON.parse(str);
   testArr = new ArrayCollection(ArrayUtil.toArray(temp));

   for (var i:int = 0; i < testArr.length; i++)
   {
       var item:Object = testArr[i];
       item.testVals = new ArrayCollection(item.testVals);
   }   
}

Dynamically fill comboBox providers in Flex Datagrid

2 Answers