Problem with Datagrid itemrenderer with a Datagrid

Hi all,
I have this kind of a structure. I try to use a datagrid item renderer in a data grid column. However when I try to move rows inside the same datagrid I experience a problem. When my datagrid loads first it seems correct, but when I drag and drop a row in the same datagrid inner datagrids start to be drew in wrong rows. I checked the DB but there are no mistakes in DB records. Problem is with rendering. I suppose inner datagrids trying to draw to early or datagrid component is trying to reuse the itemrenderer. I could not find any solutions for that. Any help will be greatly appreciated..
<mx:DataGridColumn width="130" editable="false"
          headerText="{resourceManager.getString('resources', 'acl.content')}">
          <mx:itemRenderer>
               <mx:Component>
                    <ACLInnerDataGrid rowCount="3"     dragEnabled="true"     dropEnabled="false"
                    x="0" y="0"     editable="true" dragInitiatorId="catGrid"
                    filterGroupName="content" remoteDestination="zend"
                    remoteSource="ACLFilterParamService" showHeaders="false"
                    creationComplete="this.init();">
                         <columns>
                              <mx:DataGridColumn dataField="id" editable="false" visible="false"/>
                              <mx:DataGridColumn dataField="ruleId" editable="false" visible="false"/>
                              <mx:DataGridColumn dataField="filterKey" editable="false" visible="false"/>
                              <mx:DataGridColumn dataField="param" editable="false" visible="false"/>
                              <mx:DataGridColumn dataField="name" editable="true"/>
                         </columns>
                    </ACLInnerDataGrid>
               </mx:Component>
          </mx:itemRenderer>
</mx:DataGridColumn>
Thanks in advance.

I have attached the item renderer component source code.

Similar Messages

DataGrid itemrenderer with switch statement

Hi,
I have datagrid control with this columns
<mx:DataGrid id="dgvParagraphs" >
    <mx:columns>
        <mx:DataGridColumn dataField="type" headerText="Type"/>
        <mx:DataGridColumn dataField="title" headerText="Title"/>
        <mx:DataGridColumn dataField="content" visible="false"/>
    </mx:columns>
</mx:DataGrid>
Under type column I have values from 1 to 6. Each number presents type of content. I have icons for each type. I would like to show icon instead of just number. I know this can be done using itemrenderes but I don't know how to accomplish this.

If this post answers your question or helps, please mark it as such.
Greg Lafrance
www.ChikaraDev.com
Flex Development and Support Services
You might see issues with this code during scrolling, as DataGrid recycles itemRenderers, but in that case the icon information must be in the data.
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">
<mx:Script>
    <![CDATA[
      public function getImageSource(item:Object):String{
        var retVal:String;
        switch(uint(item.type)){
          case 1:
            retVal = "black.png";
            break;
          case 2:
            retVal = "blue.png";
            break;
          case 3:
            retVal = "gray.png";
            break;
          case 4:
            retVal = "green.png";
            break;
          case 5:
            retVal = "purple.png";
            break;
          case 6:
            retVal = "red.png";
            break;
        trace(retVal);
        return retVal;
    ]]>
</mx:Script>
<mx:DataGrid id="dgvParagraphs" dataProvider="{dataXML..item}">
    <mx:columns>
      <mx:DataGridColumn dataField="type" headerText="Type" width="50">
        <mx:itemRenderer>
          <mx:Component>
            <mx:Image source="{outerDocument.getImageSource(data)}" horizontalAlign="center"/>
          </mx:Component>
        </mx:itemRenderer>
      </mx:DataGridColumn>
      <mx:DataGridColumn dataField="title" headerText="Title" width="100"/>
      <mx:DataGridColumn dataField="content" visible="false"/>
    </mx:columns>
</mx:DataGrid>
<mx:XML id="dataXML" xmlns="">
    <data>
      <item>
        <type>2</type>
        <title>My Title 1</title>
        <content>Content 1</content>
      </item>
      <item>
        <type>5</type>
        <title>My Title 2</title>
        <content>Content 2</content>
      </item>
      <item>
        <type>3</type>
        <title>My Title 3</title>
        <content>Content 3</content>
      </item>
      <item>
        <type>1</type>
        <title>My Title 4</title>
        <content>Content 4</content>
      </item>
      <item>
        <type>4</type>
        <title>My Title 5</title>
        <content>Content 5</content>
      </item>
      <item>
        <type>6</type>
        <title>My Title 6</title>
        <content>Content 6</content>
      </item>
      <item>
        <type>2</type>
        <title>My Title 7</title>
        <content>Content 7</content>
      </item>
      <item>
        <type>1</type>
        <title>My Title 8</title>
        <content>Content 8</content>
      </item>
      <item>
        <type>4</type>
        <title>My Title 9</title>
        <content>Content 9</content>
      </item>
      <item>
        <type>5</type>
        <title>My Title 10</title>
        <content>Content 10</content>
      </item>
      <item>
        <type>2</type>
        <title>My Title 11</title>
        <content>Content 11</content>
      </item>
    </data>
</mx:XML>
</mx:Application>

Problem with Checkbox ItemRenderer in a DataGrid

Hello Everyone,
I'm using a datagrid with two columns, which is used as a data entry grid. The first column has a simple text input field and the 2nd column has a checkbox as an itemrenderer. On creationComplete event, I'm passing an arraycollection as the dataprovider for this datagrid. The arraycollection:
<mx:ArrayCollection id="psAC">
        <mx:source>
            <mx:Array>
                <mx:Object PaText="line1" PaCheckbox="0" />
                <mx:Object PaText="line2" PaCheckbox="0" />
                <mx:Object PaText="line3" PaCheckbox="1" />
                <mx:Object PaText="line4" PaCheckbox="0" />
                <mx:Object PaText="line5" PaCheckbox="0" />
            </mx:Array>
        </mx:source>
    </mx:ArrayCollection>
There is a datagrid (dGa) in the main application. On click of this, a pop up window comes up which has the same datagrid layout(i.e, 2 columns). And this is where the data is entered. Here, if the user checks the check box, I have assigned a value of '1' for the 2nd column of the arraycollection. THis code(below) works fine.
<datagrid in pop up window>
<mx:DataGridColumn headerText="Best Possible Action?" textAlign="center" width="200" editable="false">
                            <mx:itemRenderer>
                                <mx:Component>
                                   <mx:CheckBox>
                                        <mx:Script>
                                                <![CDATA[
                                                     override public function set data(value:Object):void{
                                                         if(value.PaCheckbox == 1){
                                                            this.selected = true;
                                                        }else{
                                                            this.selected = false;
                                                ]]>
                                            </mx:Script>
                                        
                                    </mx:CheckBox>
                                </mx:Component>
                            </mx:itemRenderer>
                        </mx:DataGridColumn>
But I would also need to set the PaCheckbox value to 0 or 1, based on teh check condition of the check box. I tried using change event (commented in the code above). But there I get an error: Cannot access a property or method of a null object reference. I checekd in debug mode, there the data object is null! Can you please help me on how to pass back the values(0 o 1) to my arraycollection, based on the checkbox's status?
Cheers,
Deepak

heyo,
I solved it.....
i was missing this line of code super.data = value; in the ovverriden function...Once we have this line, the data object will have teh field names and their values in it, which can be accessed on the change event...

Datagrid ItemRenderer with LinkButton.

I have one of the columns in my DataGrid which needs to be a LinkButton. The actual data value is 0 or 1 but I want the LinkButton to be visible only if the data value is 1. The problem is that LinkButton is always visible. How can I selectively make it visible or invisible on different rows of DataGrid ? I tried making the visible attribute bound with the value of the flag but no success.
<mx:DataGridColumn itemRenderer="LinkButtonItemRenderer" dataField="flag" />
Following is the LinkButtonItemRenderer code.
<mx:LinkButton xmlns:mx="http://www.adobe.com/2006/mxml" visible="{data.flag == 1}" label="Click Me" />

Hi MoreGart,
You can try this...
<mx:LinkButton xmlns:mx="http://www.adobe.com/2006/mxml" render="(Number(data.flag) == 1)?(visible = true):(visible = false)" label="Click Me" />
Try this ans let me know...
Thanks,
Bhasker

Flex datagrid itemRenderer with different states

Hi,
I have a datagrid with allowMultipleSelection="true" & itemRenderer as my custom component. The custom component have 2 states "NORMAL" & "EXPANDED".
Now on row selection the renderer should change its state from NORMAL to EXPANDED state. And if I am selecting multiple rows then all the selected rows should be in EXPANDED state.
As soon as the selection goes the renderer should retain its NORMAL state.
I am stuck. Please help me out.
Thanks in advance.

Use itemclick property of grid and it passes ListEvent to the method given for itemclick. use selectedindices or selectedcells property in grid to find which are selected and change the states for the renderers of selected rows. U can get the renderer for the current selected row using event.itemRenderer property. Hope this helps.

Problem with checkbox item renderer in datagrid

I have a data grid having check box as an item renderer. I have viewed many posts in this forum but nothing useful in my case. I am failed to bind my datagrid itemrenderer checkbox with the field of dataprovider i.e. listUnitMovement.CHECK_PATH. Then I have to traverse data provider to check which checkboxes are checked.
[Bindable]
var listUnitMovement:XMLList=null;
In a function call
public function init(event:ResultEvent):void
    listUnitMovement=event.result.unitmovement;
     <mx:DataGrid id="dg_country"
                           dataProvider="{listUnitMovement}"
                              enabled="true">
                            <mx:columns>
                               <mx:DataGridColumn>
                                    <mx:itemRenderer>
                                        <mx:Component>
                                            <mx:CheckBox selectedField="CHECK_PATH" />
                                        </mx:Component>
                                    </mx:itemRenderer>
                                </mx:DataGridColumn>
                                <mx:DataGridColumn headerText="Latitude" dataField="NEW_LAT" visible="false"/>
                                <mx:DataGridColumn headerText="Longitude" dataField="NEW_LONG" visible="false"/>
                               <mx:DataGridColumn>
                                    <mx:itemRenderer>
                                        <mx:Component>
                                            <mx:Button label="Details"/>
                                        </mx:Component>
                                    </mx:itemRenderer>
                                </mx:DataGridColumn>
                            </mx:columns>
                        </mx:DataGrid>

Hi,
Do you want to just check/uncheck the checkboxes based on the CHECK_PATH field.
Do you want something like this...
<?xml version="1.0" encoding="utf-8"?><mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
<mx:Script>
<![CDATA[
import mx.collections.ArrayCollection;[
Bindable]
private var listUnitMovement:ArrayCollection = new ArrayCollection([{CHECK_PATH:true,NEW_LAT:109.233,NEW_LONG:232.22},{CHECK_PATH:true,NEW_LAT:109.233,NEW_LONG:232.22},{CHECK_PATH:false,NEW_LAT:133.233,NEW_LONG:702.22}]);]]>
</mx:Script>
<mx:DataGrid dataProvider="{listUnitMovement}">
<mx:columns>
<mx:DataGridColumn>
<mx:itemRenderer>
<mx:Component>
<mx:CheckBox selectedField="CHECK_PATH" change="data.CHECK_PATH=selected" />
</mx:Component>
</mx:itemRenderer>
</mx:DataGridColumn>
<mx:DataGridColumn dataField="NEW_LAT"/>
<mx:DataGridColumn dataField="NEW_LONG"/>
</mx:columns>
</mx:DataGrid>
</mx:Application>
Please let me know clearly what's your problem...Do you want to just bind the check box based on XmlList or something else..?
Thanks,
Bhasker Chari.S

Datagrid itemrenderer list rowcount not changing with data

I have a datagrid with an itemrenderer. the itemrenderer is a list component. I populate the list with different values for each datagrid row. this works fine. However, I want the list to reset the rowcount for each datagrid row. This is not happening. if the first datagrid row list box is 3 rows every list box in that column is 3 rows no matter what i do. here's my code:
<mx:List xmlns:mx="http://www.adobe.com/2006/mxml" rowCount="1">
<mx:Script>
<![CDATA[
   import mx.utils.ObjectProxy;
   import mx.collections.ArrayCollection;
   import mx.utils.ArrayUtil;
   [Bindable] private var arr:Array;
   override public function set data( value:Object ) : void
    super.data = value;
    if(value != null && value.MEET is ArrayCollection)
     var len:Number = value.MEET.length;
     arr = new Array();
     for each (var obj:ObjectProxy in value.MEET){
      arr.push(obj.DAYS);
     this.dataProvider = arr;
     //labelField = "DAYS";
     this.rowCount = len;
    else if (value != null && value.MEET is ObjectProxy )
     this.rowCount = 1;
     this.dataProvider = value.MEET;
     this.labelField = "DAYS";
    else
     this.rowCount = 1;
]]>
</mx:Script>
</mx:List>

Hello !
This trick makes my application freeze...
I've just an advancedDatagrid populated with arrays, and a list as renderer on some of its columns... I've got exactly the same problem (rowCount that is always the same, for all of my renderers instances), but your solution doesn't work it out...
Any idea ?
thanks a lot

WebService get list 750 records with 8 columns in mx:DataGrid atleast 2 minutes

I am using WebService (ASP.NET) to get a list of customers (around 750) records with 8 columns using mx:DataGrid. It takes to list data in the mx grid atleast 2 minutes from offline development data server[SQL SERVER 2005]. It could be better if the list populate the datagrid with-in 1 minute. I didn't find how to resolve the problem. My WebService returns the ArrayCollection within 1 minute.
Any hints would appreciate!
T. Ghosh

It doesn’t matter how many records, what matters is how many attributes and sub-objects. One customer returned 100 records, each with a transaction history of some 10,000 transactions, although the transactions were not displayed in the datagrid (it would be later in the detail view). Then the app was configured to convert the records to typed objects. As one would expect, it took forever. You might have to create a custom converter or just use the SOAP/XML.

Calculate accurate datagrid height with variableRowHeight and without any empty row

hi ,
how can i calculate accurate datagrid height with variableRowHeight="true" and without getting any empty row.
Currently i am calculating datagrid height on updateComplete event of datagrid as follows:
public function onUpdateComplete() : void
this.datagrid.headerHeight=50;
datagrid.height= datagrid.measureHeightOfItems(0, this.datagrid.dataprovider.length)+this.datagrid.headerHeight;
with following datagrid properties:
<mx:DataGrid
dataProvider="{dataArrayCollection}" width="100%" rowCount="{dataArrayCollection.length}"
id="datagrid" updateComplete="onUpdateComplete()" paddingLeft="0" paddingRight="0" paddingTop="0" paddingBottom="0"
fontSize="12" wordWrap="true" variableRowHeight="true" verticalScrollPolicy="off" >
With this approach the issue is, i am getting scrollbar on datagrid's container. I want scrollbar for datagrid instead of its container so that i can have only rows to be scrollable and not the header. Also, if i set verticalScrollPolicy of datagrid as "auto", i get empty rows.
So,is there any way to have datagrid with following properties:
variable row height
no empty rows
word wrap for headers as well as for rows
Scrollbar for grid i.e. header should remain fix ,only rows should be scrollable
no horizontal scrollbar
TIA

http://blogs.adobe.com/aharui/2010/10/mx-datagrid-list-and-variablerowheight
.html

Datagrid itemRenderer/itemEditor trouble

I have a datagrid in a Flex project, the data grid has an XML file as the source (contents below), now due to the way it is formatted (I cannot change this) some of the data I want to display is inside a tag that isnt at the initial array level. Here is the file:
<?xml version="1.0" encoding="utf-8" ?>
<Categories>
<Category>
<CategoryName>Cat 1</CategoryName>
<CategoryLink>http://www.google.com</CategoryLink>
<CategoryData>
   <CategoryDescription>This is the description of category 1</CategoryDescription>
   <CategoryHeader>My Category Title 1</CategoryHeader>
   <CategoryNumber>1</CategoryNumber>
</CategoryData>
</Category>
</Categories>
I need to display CategoryName, CategoryLink, CategoryData.CategoryDescription, CategoryData.CategoryNumber.
Now I blindly dropped the datagrid into the project and bound it to the data source, I get the following returned for CategoryData:
[object CategoryData_type]
Not much use, but with what appears to be a hack I changed the code for the column to read dataField="CategoryData.CategoryDescription", and hooray it works. I didnt realise at the time that this was wrong, and when I dropped in an itemEditor things went wrong. When the datagrids load they display the correct data, but then when you try to edit any of the child property fields you get the following error:
ReferenceError: Error #1069: Property CategoryData.CategoryDescription not found on valueObjects.Category_type and there is no default value.
I have looked up the error and I realise that it means that there is no value for CategoryData.CategoryDescription, but if I can display it why can i not edit it! What do I have to do to make this work?
Anyway, here is the code, it shows the default bound datagrid, a second datagrid with the hack applied, and a third hacked datagrid with an itemRenderer and itemEditor on the number columns
Can you please take a look and tell me what I did wrong, well more to the point, if there is a doc that explains how to deal with XML like this then please point me at it.
I did try changing the return type for ANY of the columns, but this fails, I also tried a labelFunction, but again I can get the [object CategoryData_type] to display, but I get the null reference exception as the datagrid loads if I try to get to the child props.
Here is the Flex code:
<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
      xmlns:s="library://ns.adobe.com/flex/spark"
      xmlns:mx="library://ns.adobe.com/flex/mx"
      xmlns:categories="services.categories.*"
      minWidth="955" minHeight="600">
<fx:Script>
<![CDATA[
   import mx.controls.Alert;
   import mx.events.FlexEvent;
   protected function dataGrid_creationCompleteHandler(event:FlexEvent):void
    getDataResult.token = categories.getData();
   protected function lftest(item:Object, column:GridColumn):String
    var t:String = item.CategoryData;
    return t;
]]>
</fx:Script>
<fx:Declarations>
<s:CallResponder id="getDataResult"/>
<categories:Categories id="categories"
          fault="Alert.show(event.fault.faultString + '\n' + event.fault.faultDetail)"
          showBusyCursor="true"/>

</fx:Declarations>
<s:DataGrid id="dataGrid" x="10" y="10" width="684"
    creationComplete="dataGrid_creationCompleteHandler(event)" editable="true"
    requestedRowCount="4">
<s:columns>
   <s:ArrayList>
    <s:GridColumn width="100" dataField="CategoryName" headerText="CategoryName"></s:GridColumn>
    <s:GridColumn width="100" dataField="CategoryLink" headerText="CategoryLink"></s:GridColumn>
    <s:GridColumn width="180" dataField="CategoryData" headerText="CategoryData"></s:GridColumn>
   </s:ArrayList>
</s:columns>
<s:typicalItem>
   <fx:Object CategoryData="CategoryData1" CategoryLink="CategoryLink1"
        CategoryName="CategoryName1"></fx:Object>
</s:typicalItem>
<s:AsyncListView list="{getDataResult.lastResult}"/>
</s:DataGrid>
<s:DataGrid id="dataGrid2" x="10" y="147" width="684" editable="true" requestedRowCount="4">
<s:columns>
   <s:ArrayList>
    <s:GridColumn width="100" dataField="CategoryName" headerText="CategoryName"></s:GridColumn>
    <s:GridColumn width="100" dataField="CategoryLink" headerText="CategoryLink"></s:GridColumn>
    <s:GridColumn width="180" dataField="CategoryData" headerText="CategoryData"></s:GridColumn>
    <s:GridColumn dataField="CategoryData.CategoryDescription" headerText="Desc"></s:GridColumn>
    <s:GridColumn dataField="CategoryData.CategoryHeader" headerText="Head"></s:GridColumn>
    <s:GridColumn dataField="CategoryData.CategoryNumber" headerText="Num"></s:GridColumn>
   </s:ArrayList>
</s:columns>
<s:typicalItem>
   <fx:Object CategoryData="CategoryData1" CategoryLink="CategoryLink1"
        CategoryName="CategoryName1"></fx:Object>
</s:typicalItem>
<s:AsyncListView list="{getDataResult.lastResult}"/>
</s:DataGrid>
<s:DataGrid id="dataGrid3" x="10" y="284" width="684" editable="true" requestedRowCount="4">
<s:columns>
   <s:ArrayList>
    <s:GridColumn width="100" dataField="CategoryName" headerText="CategoryName"></s:GridColumn>
    <s:GridColumn width="100" dataField="CategoryLink" headerText="CategoryLink"></s:GridColumn>
    <s:GridColumn width="180" dataField="CategoryData" headerText="CategoryData"></s:GridColumn>
    <s:GridColumn headerText="Number">
     <s:itemRenderer>
      <fx:Component>
       <s:GridItemRenderer>
        <s:NumericStepper value="{data.CategoryData.CategoryNumber}" />
       </s:GridItemRenderer>
      </fx:Component>
     </s:itemRenderer>
    </s:GridColumn>
    <s:GridColumn dataField="CategoryData.CategoryNumber" headerText="Number">
     <s:itemEditor>
      <fx:Component>
       <s:GridItemEditor>
        <s:NumericStepper value="{data.CategoryData.CategoryNumber}" />
       </s:GridItemEditor>
      </fx:Component>
     </s:itemEditor>
    </s:GridColumn>
   </s:ArrayList>
</s:columns>
<s:typicalItem>
   <fx:Object CategoryData="CategoryData1" CategoryLink="CategoryLink1"
        CategoryName="CategoryName1"></fx:Object>
</s:typicalItem>
<s:AsyncListView list="{getDataResult.lastResult}"/>
</s:DataGrid>
</s:Application>
All and any advice welcome.
Shaine

One last try, I now know for sure that the data in the file is loading, I created a labelFunction on the CategoryDescription column that looks like this:
protected function dispData(item:Object, column:GridColumn):String
    var t:Object = item.CategoryData;
    var s:String = item.CategoryData.CategoryDescription;
    return s;
Because it returns s, which I now know is undefined (which is the problem!) I managed to get a debug output. As you can see the value of t is the categorydata, and it appears to have the 3 values I need to get access to, but I have no idea how to do this. I also changed the function to read:
protected function dispData(item:Object, column:GridColumn):String
var t:Object = item.CategoryData;
var s:String = t.CategoryDescription;
return s;
But this undefines t and s! Very confused
this test2 (@d2e10a1)
item valueObjects.Category_type (@91f8a51)
[inherited]
column spark.components.gridClasses.GridColumn (@d61b239)
t valueObjects.CategoryData_type (@91f8c11)
[inherited]
_cacheInitialized_isValid false
CategoryDescription "This is the description of category 1"
CategoryHeader "My Category Title 1"
CategoryNumber "1"
_changedObjects mx.collections.ArrayCollection (@d5d9e41)
_changeWatcherArray [] (@cfab061)
_dminternal_model _CategoryData_typeEntityMetadata (@d4286a1)
_doValidationCacheOfCategoryDescription null
_doValidationCacheOfCategoryHeader null
_doValidationCacheOfCategoryNumber null
_doValidationLastValOfCategoryDescription null
_doValidationLastValOfCategoryHeader null
_doValidationLastValOfCategoryNumber null
_internal_CategoryDescription "This is the description of category 1"
_internal_CategoryHeader "My Category Title 1"
_internal_CategoryNumber "1"
_invalidConstraints [] (@ca50fd9)
invalidConstraints_der <setter>
_isValid false
isValid_der <setter>
managingService <setter>
_managingService null
_model _CategoryData_typeEntityMetadata (@d4286a1)
_validationFailureMessages [] (@cfab0b1)
s undefined
As always all help welcome.
Shaine
Message was edited after a oops moment by: ProcessEndNow

Datagrid itemRenderer dynamic values

While working on an application I came across the following
problem. I've got a view with a datagrid, where I have several
columns. Each column needs 2 values displayed beneath each other in
one cell. You make an itemRenderer with 2 labels inside a VBox.
Easy so far. However since this scenario repeats several times it
seems counterproductive to make an itemRenderer for each cell. How
can I make the text property for the labels change for each cell
instead of being static in their values.
Thx in advance.

Your description of your requirements and your sample code do
not paint a clear enough picture.
Your dataProvider has 4 pieces of data: batchId,
bookingNumber, valueDate, immsBranch. Your current itemRenderer
references two of those pieces of data, and you say you want to
reference the other two. You can do that easily like this:
<mx:Label text="data.valueDate"/>
<mx:Label text="data.immsBranch"/>
A basic question: will your DataGrid have two rows for each
set of 4 pieces of data? If so then I understand your problem. If
not, then you must clarify exactly how and when you would like the
4 pieces of data shown in your DataGrid.
In any case, you probably need a Repeater, and then need to
figure out how to get at the right data at the right time in the
Repeater.
See this FB 3 help topic and its sub-topics:
Dynamically Repeating Controls and Containers
Also search for this in the FB3 help to see the API:
mx.core.Repeater
You can define a listener for the Repeater for the Repeat
event to specify processing for each iteration of the
repeater.

DataGrid - ItemRenderer - WordWrap

I have added an itemrenderer to a datagrid to change the
color of individual rows based on the value of of a cell. However,
the problem I am having is this. The word-wrap no longer works for
the datagrid. I imagine this is because I use a lable in my
itemrenderer. I have not been able to find just a good solution
that makes the cells look just like the normal datagrid, but with
different colors.
Any suggestions would be greatly appreciated.
Enclosed is the itemrenderer
<?xml version="1.0" encoding="utf-8"?>
<mx:Label xmlns:mx="
http://www.adobe.com/2006/mxml"
>
<mx:Script>
<![CDATA[
import mx.controls.listClasses.ListData;
import com.vo.HistoryDataValueObject;
import com.model.Model;
override protected function
updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void
super.updateDisplayList(unscaledWidth,unscaledHeight);
if (data != null && (data is HistoryDataValueObject)
if (data.monetaryAmount.indexOf("-",0) ==
data.monetaryAmount.length-1 )
setStyle("color", 0xFF0000);
else
setStyle("color", 0x000000);
]]>
</mx:Script>
</mx:Label>

I have added an itemrenderer to a datagrid to change the
color of individual rows based on the value of of a cell. However,
the problem I am having is this. The word-wrap no longer works for
the datagrid. I imagine this is because I use a lable in my
itemrenderer. I have not been able to find just a good solution
that makes the cells look just like the normal datagrid, but with
different colors.
Any suggestions would be greatly appreciated.
Enclosed is the itemrenderer
<?xml version="1.0" encoding="utf-8"?>
<mx:Label xmlns:mx="
http://www.adobe.com/2006/mxml"
>
<mx:Script>
<![CDATA[
import mx.controls.listClasses.ListData;
import com.vo.HistoryDataValueObject;
import com.model.Model;
override protected function
updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void
super.updateDisplayList(unscaledWidth,unscaledHeight);
if (data != null && (data is HistoryDataValueObject)
if (data.monetaryAmount.indexOf("-",0) ==
data.monetaryAmount.length-1 )
setStyle("color", 0xFF0000);
else
setStyle("color", 0x000000);
]]>
</mx:Script>
</mx:Label>

Move focus from one to another itemRenderer inside DataGrid itemRenderer

I have a mx: DataGrid with 4 columns that have a itemRenderer with the following settings:
- Mx:DataGrid:
<code>
<mx:DataGrid id="itensPedidoCompraList"
      width="100%"
height="120"
dataProvider="{ model.pedidoCompra.itens }"
editable="true"
itemEditEnd="itensPedidoCompraList_itemEditEndHandler(event)">
</code>
- Mx:DataGridColumn:
<code>
<mx:DataGridColumn headerText="{resourceManager.getString('cadastroPedidoCompra', 'ident.PercentualDesconto') }"
                   width="60"
                   textAlign="right"
                   rendererIsEditor="true"
                                      editorDataField="data">
      <mx:itemRenderer>
                 <fx:Component>
                       <mx:Canvas>
                                 <input:NumberInput width="55"                                                                number="@{ data.percentualDesconto }"/>
                       </mx:Canvas>
            </fx:Component>
      </mx:itemRenderer>
</mx:DataGridColumn>
</code>
The user clicks on the line of the grid and click on the column to edit.
After him change or add value, ENTER key and have to move the focus to another column in the same line.
The way I'm doing, is moving to the column below.
What is the best way to do to move to the right column?
thank you

Try adding a capture phase event listener to DataGrid for keyDown and changing the key from ENTER to TAB

Find the itemRenderer components in Datagrid

Hi,
I have defined my itemRenderer for a DataGrid with different
components like Checkbox, button etc according to the input.
I would like to access the components from the application
like dg.chkbox.
Is it possible to do that??
Thanks in advance...

Hi John,
I think u can not access directly
.but through itemRollOver event of datagrid u can access the
item renderer of particular column.
I think It will help you.
Megha

Change ItemRendere Properties in DATAGRID

Hi,
I created a DATAGRID with some Itemrenderers in it.
I am trying to change the properties of itemrendere on
rollOver of DATAGRID.
code:
Code:
<mx:DataGrid id="dataGrid" dataProvider="{targetProfiles}"
itemRollOver="onItemRollOver(event)"
itemRollOut="hideMenu(event)">
<mx:columns>
<mx:DataGridColumn id="nameCol" dataField="Name"
headerText="Name"
itemRenderer="components.itemrenderer.labelName">
</mx:DataGridColumn>
<mx:DataGridColumn id="description"
dataField="Description"
headerText="Description" />
</mx:DataGrid>
code for ITem Renderer
Code:
<?xml version="1.0"?>

<mx:VBox height="65" width="100%" xmlns:mx="
http://www.adobe.com/2006/mxml"
verticalAlign="middle">
<mx:HBox paddingLeft="20" paddingTop="5"
verticalAlign="bottom">
<mx:Label text="{data.Name}"/>
</mx:HBox>
<mx:HBox horizontalAlign="right"
verticalAlign="bottom">
<mx:Button id="options" text="Options"
visible="false"/>
</mx:HBox>
</mx:VBox>
Now what am trying to do is.. On rollOver and rollOut of
particular row in datagrid i want to make that Button in Itemrender
visible true/false(on selected row).
Any idea how to identify the itemRenderer on rollOver of
grid????
Thanks & Regards
Pratap

Hi,
Try handling rollOver event of the item renderer instead of listening on the DataGrid.
Hope this helps.

Problem with Datagrid itemrenderer with a Datagrid

Similar Messages

Maybe you are looking for