how to create a table like structure in Flex with rows as text inputs or can I have input fields in the datagrid column??

Question

I want to create a table like structure in Flex, with labels as header. The rows entries might be a check box or a text input box,Like give below.

select | task name | task id | task type

(check box) | (text box) | (text box) | (text box)

(check box) | (text box) | (text box) | (text box)

Or can I create a data grid and have text input boxes or check boxes as column values?

Answer 1

Yes you can. Set the DataGridColumn's editable and rendererIsEditor properties to true to get TextInputs in the cells. Use custom item renderer to get check boxes.

<mx:XMLListCollection id="listCol" source="{xmlList}"/>
<mx:XMLList id="xmlList" xmlns="">
    <item>
     <text>Text 1</text>
     <flag>true</flag>
    </item>
    <item>
     <text>Text 2</text>
     <flag>false</flag>
    </item>
</mx:XMLList>
<mx:DataGrid dataProvider="{listCol}">
    <mx:columns>
     <mx:DataGridColumn editable="true" rendererIsEditor="true" 
      editorDataField="selected">
      <mx:itemRenderer>
       <mx:Component>
        <mx:CheckBox selected="{data.flag == 'true'}"/>
       </mx:Component>
      </mx:itemRenderer>
     </mx:DataGridColumn>
     <mx:DataGridColumn editable="true" rendererIsEditor="true" 
      dataField="text"/>
    </mx:columns>
</mx:DataGrid>