Detailed editing features of the DataGrid in Flex

In the flex DataGrid, there are a number of situations where it is necessary to embed other controls, such as Checkbox,combox, to take advantage of the following functions of the DataGrid:

about 1.datagrid editing features
When we click on a cell in the DataGrid for editing, we can use a combination of components, Radiobuttongroup, checkbox, ComboBox, etc.
The editing function of the DataGrid must use the following components: Editordatafield, Itemeditor, and Itemrenderer.

The Editordatafield property determines the properties of the project editor that contains the new data and updates the data provider project with the new data. Because the default project editor is the TextInput control, the default value of the Editordatafield property is "text" to specify that the Text property of TextInput contains the new project data.
Itemeditor is the cell editor for the DataGrid, and Itemrenderer is the renderer, which means that. itemeditor only appears when the cell is in edit state.
Itemrenderer is always displayed (is the user's concern, the column of the custom DataGrid)

Save after editing the DataGrid data
Instead of reading the values of each item from the DataGrid one by one, it is best to bind to the DataGrid through the ArrayCollection data source and read the arraycollection directly if you need to read the edited values. Specifically read the article "The data for the DataGrid control can be edited》。

2.editorDataField How to use
Property Description:
public var editordatafield:string = "Text"
The property name of the project editor that contains the new data for the list item. For example, the default itemEditor is TextInput, so the default value for the Editordatafield property is "text", which specifies the text property of the TextInput control.

Example 1:
<mx:datagridcolumn headertext= "name" id= "DG2" datafield= "name" editable= "true" editordatafield= "text"/>
The above code description indicates that the name column can be edited by the TextInput control and passed the value of the TextInput control's Text property to DataGridColumn. editordatafield= "Text" is the default value and can not be written.

Example 2:
<mx:datagridcolumn headertext= "Prices" id= "DG3" datafield= "Price" editordatafield= "value" editable= "false" >
<mx:itemRenderer>
<fx:Component>
<mx:numericstepper maximum= "minimum=" >
</mx:NumericStepper>
</fx:Component>
</mx:itemRenderer>
</mx:DataGridColumn>
editordatafield= "value" means to pass the property value of the control Numericstepper to DataGridColumn

3.ItemEditorHow to use
Property Description:
public Var itemeditor:ifactory
When you edit the column, the class factory that invokes the column's Project editor instance creates an edit class.
The default value is new ClassFactory (mx.controls.TextInput). See this article, "Editordatafield How to use》

Example 1:
<mx:datagridcolumn datafield= "Score"
Editable= "true"
Itemeditor= "Mx.controls.NumericStepper"
editordatafield= "Value"/>
This means that when you enter the editing state, Itemeditor creates the Numericstepper object and binds the Numericstepper property to the cell.
If you want to further specify the value range of the Numericstepper, etc., you can use the following code
<mx:datagridcolumn headertext= "Quantity" datafield= "Count" editordatafield= "value" >
<mx:itemEditor>
<fx:Component>
<mx:numericstepper maximum= "minimum=" >
</mx:NumericStepper>
</fx:Component>
</mx:itemEditor>
</mx:DataGridColumn>

Example 2:
If the bound object property does not correspond to the Itemeditor specified control, such as the date in the data source is a string type and must be edited with the date type. You can use the following code:
<mx:datagridcolumn headertext= "DateString"