Flexponential

It’s easy to delete an item in a spark List from within an item renderer. This is handy if you have a List with a custom renderer that provides a button to delete the item that is associated with that renderer.

You can do this by using the ItemRenderer’s owner property to access the List it is in, drill down to its dataProvider and delete the data item:

<s:ItemRenderer>
    <fx:Script>
        <![CDATA[
                import spark.components.List;
                public function deleteItem():void {
                    var parentList:List = owner as List;
                    // remove the item
                    parentList.dataProvider.removeItemAt(parentList.dataProvider.getItemIndex(data))
                }
            ]]>
        </fx:Script>
        <s:HGroup>
            <s:Label text="{data}" />
            <s:Button id="remove" label="X"  click="deleteItem()"/>
        </s:HGroup>
</s:ItemRenderer>

Another approach is to delete items based on the selectedItem/selectedIndex, but I prefer this method since it allows you to delete items without needing to select them.

Here is an example that uses the deleteItem() method listed above:

View Source

This should work the same way for DataGroup and SkinnableDataContainer as well.

Note: This sample requires Flex SDK 4.0.0.10545 or higher. You can get the latest SDK builds from opensource.adobe.com.