Keep current value when edit in datagrid - Adobe Flex

Question

I have two datagrids, and it's possible to drag any items from datagrid A to drop in datagrid B. In datagrid B, I can edit the values, and those values have limits minimum and maximum. The values have a currency format. However, I have a problem: when I edit a value in an item dropped in datagrib B, the value automatically change to minimum value.

The correct is keep the current value when edit.

Any idea?

The code:

<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
               xmlns:s="library://ns.adobe.com/flex/spark" 
               xmlns:mx="library://ns.adobe.com/flex/mx" 
               width="650"
               creationComplete="initApp();">

<fx:Script>
    <![CDATA[
        import mx.collections.ArrayCollection;
        import mx.events.DataGridEvent;

        private function initApp():void {
            dgA.dataProvider = new ArrayCollection([
                {Expense:'Electricity', Value:300, minNo: 100, maxNo: 500},
                {Expense:'Phone', Value:200, minNo: 50, maxNo: 300},
                {Expense:'Contract A', Value:5000, minNo: 4000, maxNo: 6000},
                {Expense:'Contract B', Value:6000, minNo: 4500, maxNo: 8500},
                {Expense:'Contract C', Value:3000, minNo: 2500, maxNo: 3500}
            ]);

            dgB.dataProvider = new ArrayCollection([]);
        }

        private function disableEditing(event:DataGridEvent):void {
            if(event.columnIndex==0)
            {
                event.preventDefault(); 
            }
        }

        protected function LabelFormatter(item:Object, column:DataGridColumn):String
        {
            return MoedaFormatter.format(item.Value);
        }

    ]]>
</fx:Script>

<fx:Declarations>
    <mx:CurrencyFormatter id="MoedaFormatter" precision="2" currencySymbol="R$" alignSymbol="left" decimalSeparatorTo="," decimalSeparatorFrom=","  thousandsSeparatorFrom="." thousandsSeparatorTo="."/>
</fx:Declarations>

<s:HGroup>

    <s:VGroup>
        <s:Label text="Cost 1"/>
        <mx:DataGrid id="dgA"
                     allowMultipleSelection="true" 
                     dragEnabled="true" 
                     dropEnabled="true" 
                     dragMoveEnabled="true">
            <mx:columns>
                <mx:DataGridColumn dataField="Expense"/>
                <mx:DataGridColumn dataField="Value" labelFunction="LabelFormatter"/>
            </mx:columns>    
        </mx:DataGrid>
    </s:VGroup>

    <s:VGroup>
        <s:Label text="Cost 2"/>
        <mx:DataGrid id="dgB"
                     allowMultipleSelection="true" 
                     dragEnabled="true" 
                     dropEnabled="true" 
                     dragMoveEnabled="true"
                     editable="true"
                     itemEditBeginning="disableEditing(event);">
            <mx:columns>
                <mx:DataGridColumn dataField="Expense"/>
                <mx:DataGridColumn dataField="Value" editorDataField="value" labelFunction="LabelFormatter">
                    <mx:itemEditor>
                        <fx:Component>
                            <mx:NumericStepper stepSize="1" width="35" height="20">
                                <fx:Script>
                                    <![CDATA[
                                        override public function set data(value:Object):void
                                        {
                                            super.data = value;

                                            if (value && value.hasOwnProperty("minNo")) {
                                                minimum = value.minNo;
                                            }

                                            if (value && value.hasOwnProperty("maxNo")) {
                                                maximum = value.maxNo;
                                            }
                                        }
                                    ]]>
                                </fx:Script>
                            </mx:NumericStepper>
                        </fx:Component>
                    </mx:itemEditor>
                </mx:DataGridColumn>
            </mx:columns>    
        </mx:DataGrid>
    </s:VGroup>

</s:HGroup>

Thanks in advance!

Answer 1

Modify the set data method in your itemeditor as below

override public function set data(value:Object):void {
     super.data = value;
     if (value && value.hasOwnProperty("Value")) {
        super.value = value.Value;
     }
     if (value && value.hasOwnProperty("minNo")) {
        minimum = value.minNo;
     }

     if (value && value.hasOwnProperty("maxNo")) {
        maximum = value.maxNo;
     }
}

I have tested this myself and it is working fine

Answer 2

When you drop items from dgA, you drop object that contains minNo and maxNo properties, and script, hooked to change of data property assigns minimum and maximum properties of the item renderer.

So, just remove tag nested in dgB or comment it.