Flex - Adding a New Line in a DataGridColumn

Question

To start with, I am very new to Flex.

I have a ComboBox that is filled in with choices from the database. Underneath that is a Flex Datagrid with DataGridColumns (mx:located below). I would like to figure out a way that when a selection is made from the comboxbox and the add button is clicked, it populates the next line in the datagrid column based off what was selected. Any thoughts on how this can be done? Maybe I should not use a combobox, just populate the datagridcolumn, not for sure, any hep would be great.

ComboBox Choices - Apples, Oranges, & Pears

Each choice is linked with attributes.

(Apples) nameSpace, countrySpace, infoSpace
(Oranges) nameSpace, countrySpace, infoSpace
(Pears) nameSpace, countrySpace, infoSpace

public var ta1:ArrayCollection = new ArrayCollection();

//Is there a better way of writing this?
public function addDataGridColumn():void 
{
  var list:ArrayCollection = templateAttributes;
        var att:TemplateAttribute = new TemplateAttribute();
        (templateProp.dataProvider as ArrayCollection).addItem(att);
}
<mx:HBox>
<mx:ComboBox  dataProvider="{templateAttributes}" width="300" prompt="Select a Template Attribute" enabled="{userInEditMode}" labelField="attributeName" />
<mx:Button id="addButton" click="addDataGridColumn();" styleName="addButtonOff" enabled="{userInEditMode}" label="ADD" />
</mx:HBox>

<mx:DataGrid id="templateProp" dataProvider="{templateAttributes}" width="100%" height="100%" editable="true">
  <mx:columns>
    <mx:DataGridColumn id="nameSpace" dataField="nameSpace" headerText="Name" width="25" editable="{userInEditMode}"/>
    <mx:DataGridColumn id="valueSpace" dataField="valueSpace" headerText="Value" width="25" editable="{userInEditMode}" />
    <mx:DataGridColumn id="countrySpace" dataField="countrySpace" headerText="Main Country" width="25" editable="{userInEditMode}" />
    <mx:DataGridColumn id="infoSpace" dataField="infoSpace" headerText="Information" width="25" editable="false"/>
    <mx:DataGridColumn id="infoSpace" dataField="infoSpace" headerText="Information" width="25" editable="false"/>
  </mx:columns>
</mx:DataGrid>

Answer 1

Rewriting that function would only shave off a line of code:

public function addRow() : void {
var att:TA= new TA();
att.attributeName = "abc";
(template1.dataProvider as ArrayCollection).addItem(att);

I dunno what TA is, but if you wanted it to be even shorter, you could make TA take attributeName in its constructor. Then you could do this:

public function addRow(attributeName:String) : void {
    (template1.dataProvider as ArrayCollection).addItem(new TA(attributeName));
}