DataGridEvent.ITEM_EDIT_END

Categories: actionscript, flex
Written By: sebi

Just a quick note. I had to validate the sum of a DataGrid column after the user enters some quantities. The solution seemed to be obvious, but needs some tricking.

My first thought was create an event handler for the DataGridEvent.ITEM_EDIT_END event of the DataGrid, calculate the sum, and bind the enabled state of the Submit button to the result.

So first create the event handler:

protected function handleItemEditEnd( event:DataGridEvent ):void
{
	LOG.debug( "handleItemEditEnd() :: " )
	if( event.dataField == "quantity" )
	{
		// summarize the quantities into the "_quantity" property
		// ....
		_quantity = 10;
		dispatchEvent( new Event( "quantity_updated" ) );
	}
}

And create the bindable property getter referencing our update event:

[Bindable( event="quantity_updated" )]
public function get validateQuantity():Boolean
{
	LOG.debug( "get validateQuantity() :: _quantity: " + _quantity );
	return _quantity > 9;
}

But it turned out - by the way it’s logical - that the DataGridEvent.ITEM_EDIT_END event fires before the actual updates of the dataProvider happens. To avoid creating too complex structures and unnecessary calls, I tried to find some smarter solution. After a short googling I ended up with a DevNet article ( Detecting when data is edited in the DataGrid component ), where the author shows a solution exactly I needed.

Instead of listening to the datasource’s trillion update events, simply decreases the priority of the event listener below the datagrid’s original priority. The solution is for the Flash’s fl.events.DataGridEvent class, but the solution is similar for Flex too. In the line 548 of the mx.controls.DataGrid we can find the event listener assignment with a priority EventPriority.DEFAULT_HANDLER, what is actually -50. So let’s add the event listener with a priority below this value, for example -100, and everything will be fine:

<?xml version="1.0" encoding="utf-8"?>
<mx:HBox xmlns:mx="http://www.adobe.com/2006/mxml"
	creationComplete="init()">
	<mx:Script>
		<![CDATA[
		protected function init():void
		{
			LOG.debug( "init() :: " )
			quantityGrid.addEventListener( DataGridEvent.ITEM_EDIT_END, handleItemEditEnd, false, -100, true )
		}
		// ....
		]]>
	</mx:Script>

Leave a Reply