Datagrid itemRenderer custom component formatting

Question

OK, so this is my first attempt at an itenRenderer. This works below, but I have to imagine there is an easier way. There is also a problem with below, where the changed field (datafield=side) after the itemRenderer is applied, the text is all out of format, and there is a kind of selection on row one of that column. Obvisouly, though the translation is happening, I'm either overidding the wrong thing, or I'm doing something totally wrong.
Goal..... Show in the datagrid, the three colums below from date provided from elsewhere. (This all works), but in the 'side' data it comes in, in raw form as either an 'a' or 'b' or 'both', and I'm trying to display that as something more user friendly. So when both is read it changes it to 'No'.
Any help. This seems really easy, though I can't understanading hy my custom function screws with the cell selection, and formating?
---Main program---
<mx:DataGrid x="10" y="9" width="199" height="147" id="gdimmer_checkChannel" dataProvider="{ current_rack.getItemAt(0).rackLevels }"
  change="dimmerCheckCurrentSelection(event);"
  sortableColumns="false"
  selectedIndex="{ current_rack.getItemAt(0).currentCheckIndex }" >
<mx:columns>
  <mx:DataGridColumn headerText="UDN" dataField="udn"/>
  <mx:DataGridColumn headerText="DD" dataField="side" editable="false" itemRenderer="renderers.DataGridDDSide"/>
  <mx:DataGridColumn headerText="Circuit" dataField="circuit"/>
</mx:columns>
</mx:DataGrid>
--- Component Below ---
<?xml version="1.0" encoding="utf-8"?>
<s:MXDataGridItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009"
        xmlns:s="library://ns.adobe.com/flex/spark"
        xmlns:mx="library://ns.adobe.com/flex/mx"
        focusEnabled="true">
<s:Label id="lblData" text="{dataGridListData.label}" />
<fx:Script>
<![CDATA[
  override public function set data(value:Object):void
    if (value.side == 'both') { lblData.text = "  No" };
   if (value.side == 'a') { lblData.text = "  a" };
   if (value.side == 'b') { lblData.text = "  b" };
]]>
</fx:Script>
</s:MXDataGridItemRenderer>

Answer 1

See the latest post on my blog.  You also need to set super.data in the data
setter.
Alex Harui
Flex SDK Team
Adobe System, Inc.
http://blogs.adobe.com/aharui