Datagrid editable row

Question

Hi,
I would like to know if there is a way to make an entire row in a datagrid editable when that row is selected.  Currently when a user selects a cell of the row, only that cell becomes editable.  I would like to have that entire row become editable.  Is there a way of accomplishing this?  Thanks in advance.

Answer 1

Hi,
Just gave your code a try and, although I did not implement the ITEM_EDIT_END yet, the editor does not do anything in terms of clicking on a row and "enabling" the textfields for that row.  Below is my code along with yours:
package
    public class TestBean
        [Bindable] private var _processDefName:String;
        [Bindable] private var _processGroupName:String;       
        [Bindable] private var _processSomeName:String;
        public function get processDefName():String {
            return _processDefName;
        public function set processDefName(value:String):void {
            _processDefName = value;
        public function get processGroupName():String {
            return _processGroupName;
        public function set processGroupName(value:String):void {
            _processGroupName = value;
        public function get processSomeName():String {
            return _processSomeName;
        public function set processSomeName(value:String):void {
            _processSomeName = value;
package
import flash.events.FocusEvent;
import mx.controls.Alert;
import mx.controls.DataGrid;
import mx.controls.TextInput;
import mx.controls.dataGridClasses.DataGridColumn;
import mx.controls.dataGridClasses.DataGridListData;
import mx.controls.listClasses.BaseListData;
import mx.controls.listClasses.IDropInListItemRenderer;
import mx.controls.listClasses.IListItemRenderer;
import mx.core.UIComponent;
import mx.managers.IFocusManagerComponent;
      Two TextInput Editor for DataGrid
public class DataGridMultiFieldEditor extends UIComponent implements IListItemRenderer, IDropInListItemRenderer, IFocusManagerComponent
     private var dgOwner:DataGrid;
     private var textEditors:Array = []
     public function DataGridMultiFieldEditor()
          super();
     public function get fullValue():String
          dgOwner = owner as DataGrid;
          var colInd:Number = dgOwner.editedItemPosition.columnIndex;
          return TextInput(textEditors[colInd]).text;
     private var _data:Object;
     public function get data():Object
          return _data;
     public function set data(value:Object):void
          _data = value;
          invalidateProperties ();
     private var _listData:BaseListData;
     public function get listData():BaseListData
          return _listData;
     public function set listData(value:BaseListData):void
          _listData = value;
     override public function setFocus():void
     override protected function createChildren():void
          dgOwner = owner as DataGrid;
          super.createChildren ();
        var child:TextInput;
          textEditors = new Array();
        var n:int = dgOwner.columns.length;
        for (var i:int = 0; i < n; i++)
            child = new TextInput();
            textEditors.push(child)
            addChild(child);
     override protected function commitProperties():void
          dgOwner = owner as DataGrid;
          super.commitProperties();
        var n:int = dgOwner.columns.length;
        for (var i:int = 0; i < n; i++)
              var dgColumn:DataGridColumn = dgOwner.columns[i];
              var value:String = data[dgColumn.dataField];
              TextInput(textEditors).text = value;
     override protected function updateDisplayList(w:Number, h:Number):void
          dgOwner = owner as DataGrid;
          super.updateDisplayList(w, h);
        var n:int = dgOwner.columns.length;
        var xx:Number = 0;
        for (var i:int = 0; i < n; i++)
             TextInput(textEditors).move(xx, 0);
            var ww:Number = dgOwner.columns.width;
             TextInput(textEditors).setActualSize(ww, h);
            xx += ww;
     private function keyFocusChangeHandler(event:FocusEvent):void
<?xml version="1.0" encoding="utf-8"?>
<mx:Application
    xmlns:mx="http://www.adobe.com/2006/mxml"
    layout="absolute"
    creationComplete="init();">
    <mx:Script>
        <![CDATA[
            import mx.collections.ArrayCollection;
            [Bindable] private var col:ArrayCollection = new ArrayCollection();
            private function init():void {
                var tbA:TestBean = new TestBean();
                tbA.processDefName = "A";
                tbA.processGroupName = "Group A";
                tbA.processSomeName = "AAAAAAAA";
                var tbB:TestBean = new TestBean();
                tbB.processDefName = "B";
                tbB.processGroupName = "Group B";
                tbB.processSomeName = "BBBBBBBB";
                col.addItem(tbA);
                col.addItem(tbB);               
        ]]>
    </mx:Script>  
    <mx:VBox>
        <mx:DataGrid editable="true" id="dg" dataProvider="{col}" width="300">
            <mx:columns>
                <mx:DataGridColumn width="100" editable="true" dataField="processGroupName" headerText="NAME" editorWidthOffset="200" itemEditor="DataGridMultiFieldEditor" editorDataField="fullValue"/>
                <mx:DataGridColumn width="100" editable="true" dataField="processDefName" headerText="TYPE" editorXOffset="-100" editorWidthOffset="200" itemEditor="DataGridMultiFieldEditor" editorDataField="fullValue" />
                <mx:DataGridColumn width="100" editable="true" dataField="processSomeName" headerText="MISC" editorXOffset="-200" editorWidthOffset="200" itemEditor="DataGridMultiFieldEditor" editorDataField="fullValue"/>
            </mx:columns>
        </mx:DataGrid>
    </mx:VBox>
</mx:Application>