How to set a ComboBox itemEditor dataProvider at runtime

On a forum (probably flexcoders), someone recently asked how to set the dataProvider for a ComboBox itemEditor at runtime. They wanted to set a different dataProvider for each of the ComboBoxes depending on their data. So, I decided to put this quick example together using a DataGrid with inline itemEditors that are ComboBoxes.

The DataGridColumn itemEditor that uses a ComboBox looks like this:

<mx:DataGridColumn dataField=”city” headerText=”Destination City” editorDataField=”
selectedItem”>
<mx:itemEditor>
<mx:Component>
<mx:ComboBox initialize=”outerDocument.addData(event)” />
</mx:Component>
</mx:itemEditor>
</mx:DataGridColumn>

In the ComboBox’s initialize handler, we are calling a function that will set its dataProvider. Her is what the function addData looks like:

public function addData(event:FlexEvent) : void
{
if(dg.dataProvider[dg.selectedIndex]['country'] == “Italy”)
ComboBox(event.target).dataProvider = ItalianCities;
else
ComboBox(event.target).dataProvider = UKCities;

}

The function checks what the selected item, then, they set a dataProvider for the editor accordingly.

You can run the sample here: ComboBoxItemRendererSample.swf

In the example, click any row in the right side column to bring up the itemEditor that is a ComboBox.

Code: ComboBoxItemRendererSample.mxml

---

Possibly related posts: (automatically generated)

• Dynamic itemRenderer using a ComboBox
• How to add a separator to your ComboBox
• fumbling through flex: components > datagrid > itemeditors > dataprovider >…
• Tips & Tricks – adding a combobox to a datagrid header as headerRenderer

~ by jlafferty on October 10, 2008.