1 Reply Latest reply on Oct 20, 2010 10:37 AM by Flex harUI

    datagrid itemRenderer custom component formatting

    mumcs01 Level 1

      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>