Question

I have a Spark List with a data provider consisting of a list of filled out form applications. What is the best way to add a button to each List Item (form application)? This button will be named Open and will navigate to the specified form application.

Thanks in advance for any advice!

Answer 1

This is similar to what @www.Flextras.com said, so I’m not going to repeat that. However, I’ll add an example and one or two things.

Your custom ItemRenderer might look like this:

<s:ItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009" 
                xmlns:s="library://ns.adobe.com/flex/spark">

    <fx:Script>
        <![CDATA[
            import mx.events.ItemClickEvent;

            private function requestForm():void {
                var event:ItemClickEvent = new ItemClickEvent(ItemClickEvent.ITEM_CLICK);
                event.index = itemIndex;
                event.item = data;
                owner.dispatchEvent(event);
            }
        ]]>
    </fx:Script>

    <s:Label id="labelDisplay" verticalCenter="0" />
    <s:Button right="0" label="open" verticalCenter="0" click="requestForm()" />

</s:ItemRenderer>

Two things that differ from Flextras’ answer:

• I use the built-in ItemClickEvent instead of a custom event > less
  coding
• I dispatch the event on the owner of the ItemRenderer, which
  is in fact the List that contains this ItemRenderer. Because of this,
  you don’t need to bubble the Event.

Now to open the form when the Button is clicked, do something like this:

myList.addEventListener(ItemClickEvent.ITEM_CLICK, openForm);

private function openForm(event:ItemClickEvent):void {
    trace("open " + event.item.toString());
}