Thursday, February 14, 2008

ChartItemEvent.CHANGE in conflict with IndexChangedEvent

Earlier this week I ran into a strange problem when the ChartItemEvent.CHANGE event is raised. It seems that the string behind the constant is 'change' and this happens to be the same as the string behind the IndexChangedEvent.CHANGE event. Probably programmed on monday morning :)

Fortunately there's a simple workaround:
Put a container around your 'problematic' charting component (for example a canvas) and attach a listener to the ChartItemEvent.CHANGE event to stop it from propagating.

<mx:Canvas id="canvas" creationComplete="canvasInit()">
  <mx:PieChart id="pieChart" ... />
</mx:Canvas>

// Hack to prevent propagation of the ChartItemEvent.CHANGE as it is in conflict with IndexChangedEvent.CHANGE
private function canvasInit(): void
{
canvasInit.addEventListener(ChartItemEvent.CHANGE, chartItemEventChange, true, 0, true);
}

private function chartItemEventChange(event: Event): void
{
event.stopImmediatePropagation();
}

14 comments:

MockTurtle said...

nice trick, thanks :)

btw. found this issue in the flex bug tracker: http://bugs.adobe.com/jira/browse/SDK-11156?page=com.atlassian.jira.plugin.system.issuetabpanels:all-tabpanel

its closed but not fixed...

hassan said...

Where i use this code

In My Application ?

Or

In My Module ?

------------

private function canvasInit(): void
{
canvasInit.addEventListener(ChartItemEvent.CHANGE, chartItemEventChange, true, 0, true);
}

private function chartItemEventChange(event: Event): void
{
event.stopImmediatePropagation();
}

------------

hassan said...

If i use in module

error ocurred

1061: Call to a possibly undefined method addEventListener through a reference with static type Function.

1120: Access of undefined property ChartItemEvent.

How to resolve this ?

Christiaan van Woudenberg said...

A quick fix to the error mentioned above is to change the method signature to include the event:

private function canvasInit( event:Event ): void
{
event.target.addEventListener(ChartItemEvent.CHANGE, chartItemEventChange, true, 0, true);
}


and to change the creationComplete on your container to:

<mx:Canvas width="100%" creationComplete="canvasInit( event )">

hassan said...

Thanks

I am using in my application to direct research to put in each canvas

This can cause a problem?

I am using the following

----------------

/* Fix ChartItemEvent.CHANGE in conflict with IndexChangedEvent */
import mx.charts.events.ChartItemEvent;
private function canvasInit(event:Event): void{
event.target.addEventListener(ChartItemEvent.CHANGE, chartItemEventChange, true, 0, true);
}

private function chartItemEventChange(event: Event): void{
event.stopImmediatePropagation();
}
/* Fix ChartItemEvent.CHANGE in conflict with IndexChangedEvent */


----------------


mx:VBox width="100%" height="100%" creationComplete="canvasInit(event)"

hassan said...

please desconsider the last message

Ravi said...

Thankx good make around.

Steven Tran said...

Great work!

I am Andrea Lyons, also known as Andrea Coba.... said...

this really helped me out! Thanks

Pedro varela said...

Dude.. thanx a lot!

M├Ąttu said...

Thanks man!
Saved me a lot of time.
Greetings

Viktor said...

That is a brilliant workaround, thank you mate, just I do not understand why Adobe does not fix this, is 5 lines of code!!!

Viktor said...

Thank you, that is a brilliant workaround, I just do not understand why Adobe does not fix this it is 5 lines of code.

Anonymous said...

thanks dude, that helped