Search code examples
apache-flexactionscript-3listcheckboxitemeditor

How can I trigger an itemEditEnd Event in a Flex List when the CheckBox is checked/unchecked?


I have a List component that has drop-in CheckBox itemEditor that also serves as the itemRenderer. It displays each item as a simple CheckBox with a label.

However, the itemEditEnd Event does not get triggered until I click on something outside of the List. I want it triggered once the CheckBox is checked or unchecked.

I was thinking of manually dispatching the ListEvent.ITEM_EDIT_END in a CLICK Event handler, but then the itemEditEnd Event would get dispatched twice. There's gotta be a better way to do this.

Any ideas?

Thanks.


Solution

  • Here is the solution I came up with. I changed my List to use the component as an itemRenderer only, not as a itemRenderer and itemEditor. I then added a MouseEvent.CLICK handler to call a function in the List from the itemRenderer to perform the necessary actions:

    My List Component:

    package
    {
        import mx.controls.List;
        import mx.core.ClassFactory;
    
        public class CustomCheckBoxList extends List
        {
            public function CustomCheckBoxList()
            {
                super();
    
                itemRenderer = new ClassFactory(CheckBoxRenderer);
            }
    
            public function dispatchSelectionEvent(item:Object, selected:Boolean):void
            {
                // Take action here...
            }
        }
    }
    

    My ItemRenderer:

    package
    {
        import flash.events.MouseEvent;
    
        import mx.controls.CheckBox;
    
        public class CheckBoxRenderer extends CheckBox
        {
            public function CheckBoxRenderer()
            {
                super();
            }
    
            override protected function clickHandler(event:MouseEvent):void
            {
                super.clickHandler(event);
    
                CustomCheckBoxList(listData.owner).dispatchSelectionEvent(data, selected);
            }
        }
    }