1 Reply Latest reply on Jul 6, 2009 8:42 AM by JeffryHouser

    Creating components

    Zolotoj Level 3

      In my project I am going to have many datagrids where a user can add or remove rows to and from. I am designing a class that is going to be a custom renderer for the last column. That column will show the delete icon and when a user clicks on it the clicked row will deappear. I want to make such fuctionality generic so I can reuse it. Here is a sample code of my custom renderer:

       

      package modulecode {      import flash.events.Event;            import mx.containers.VBox;      import mx.controls.DataGrid;      import mx.controls.Image;      import mx.controls.listClasses.BaseListData;      import mx.controls.listClasses.IDropInListItemRenderer;      import mx.events.DynamicEvent;      import flash.system.*;      public class deleteRowGrid extends VBox implements IDropInListItemRenderer      {           private var _listData:BaseListData;           public function deleteRowGrid()           {                super();                          }           public function get listData():BaseListData           {                return _listData;           }           public function set listData(value:BaseListData):void           {                _listData = value;           }           [Embed(source="D:/projects/sfcs/assets/delete.png")]                      [Bindable] private var imgClass:Class;           override protected function createChildren() : void           {                if (deleteIcon == null)                {                     var deleteIcon:Image = new Image();                     deleteIcon.buttonMode = true;                     deleteIcon.useHandCursor = true;                     deleteIcon.toolTip = "Delete";                     deleteIcon.addEventListener("click", onDeleteClick);                     deleteIcon.source = imgClass;                     addChild(deleteIcon);                }                }           protected function onDeleteClick(event:Event):void           {                          var dynEvent:DynamicEvent = new DynamicEvent("deleteEvent", true);                dynEvent.data = data;                dispatchEvent(dynEvent);                          }      } }

       

      In a form with such datagrid I have the following handler for  deleteEvent:

       

      custcontacts.addEventListener("deleteEvent", onDeleteContactEvent, false, 0, true);

       

      This solution works fine, no problems at all.

      But what if a form has to have more than one datagrid withe deletable rows?

      How would I specify different handlers for the same deleteEvent?

       

      Thanks for help.

        • 1. Re: Creating components
          JeffryHouser Level 4

          I'm not sure if I completely understand the issue.  Your code is pretty massacred.

           

          > But what if a form has to have more than one datagrid withe deletable rows?

          > How would I specify different handlers for the same deleteEvent?

           

          It would be unusual to specify multiple handlers for the same event in the same component, but it is possible.

           

          custcontacts.addEventListener("deleteEvent", onDeleteContactEventHandler1, false, 0, true);

          custcontacts.addEventListener("deleteEvent", onDeleteContactEventHandler2, false, 0, true);

           

          If you are trying to figure out which component your event came from,most likely you add different listeners to each component, like this:

           

           

          myDataGrid1.addEventListener("deleteEvent", onDeleteContactEventHandler1, false, 0, true);

          myDataGrid2.addEventListener("deleteEvent", onDeleteContactEventHandler2, false, 0, true);

           

           

          Or if you need to use the same event handler for some reason, most events have properties such as target or currentTarget.

           

          Does this help?