Databases
StackOverflow2013
Postsdbo
POhow to access the listData property in item renderer for datagrid in flex 4
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POhow to access the listData property in item renderer for datagrid in flex 4
    text
    copied!<p>I have a custom datagrid. I am passing value of hslider through a property criteria into it. I have an external itemrenderer for this datagrid which extends GridItemRenderer. I want to change the item renderer dynamically based on this property criteria. To access a property from parent component which is 'criteria' I want to access the listData property. For that this custom datagrid implements the IDropinItemRender. But the value of listData coming as null.In my main application I am using this datagrid as below.</p> <pre><code>&lt;components:Mydatagrid dataProvider="{ac}" criteria="{hslider.value}"&gt; &lt;components:columns&gt; &lt;s:ArrayList&gt; &lt;s:GridColumn dataField="name" headerText="Name"&gt;&lt;/s:GridColumn&gt; &lt;s:GridColumn dataField="age" headerText="Age"&gt;&lt;/s:GridColumn&gt; &lt;s:GridColumn dataField="hair" headerText="Hair" itemRenderer="renderer.GridInlineDynamicRenderer" /&gt; &lt;/s:ArrayList&gt; &lt;/components:columns&gt; &lt;/components:Mydatagrid&gt; </code></pre> <p>This is my item renderer code. The listData property in line no2 of set data function is null.</p> <pre><code>&lt;?xml version="1.0" encoding="utf-8"?&gt; &lt;s:GridItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" xmlns:mx="library://ns.adobe.com/flex/mx" clipAndEnableScrolling="true" implements="mx.controls.listClasses.IDropInListItemRenderer" &gt; &lt;fx:Script&gt; &lt;![CDATA[ import mx.controls.dataGridClasses.DataGridListData; import mx.controls.listClasses.BaseListData; import components.Mydatagrid; private var _listData:BaseListData; public function get listData() : BaseListData { return _listData; } public function set listData( value:BaseListData ) : void { _listData = value; } protected function button1_clickHandler(event:MouseEvent):void { dispatchEvent(new Event('hairEvent',true)); } override public function set data(value:Object):void { super.data = value; var myListData:DataGridListData = DataGridListData(listData); var criteria:Number = (myListData.owner as Mydatagrid).criteria; hairClr.setStyle('color',data.hair); if(data.age &lt; criteria) alpha = 0.4; else alpha = 1; } ]]&gt; &lt;/fx:Script&gt; &lt;mx:HBox&gt; &lt;s:Button click="button1_clickHandler(event)" label="Button" /&gt; &lt;s:Label id="hairClr" text="Color" /&gt; &lt;/mx:HBox&gt; &lt;/s:GridItemRenderer&gt; </code></pre> <p>The listData is coming null here. But when I use item renderer with list component, it works. The code of item renderer is same except that for list the item renderer extends the HBox. The link to this code is this <a href="http://www.adobe.com/devnet/flex/articles/itemrenderers_pt3.html" rel="nofollow">http://www.adobe.com/devnet/flex/articles/itemrenderers_pt3.html</a>. I am just trying to implement same with datagrid.</p> <pre><code>&lt;?xml version="1.0" encoding="utf-8"?&gt; &lt;mx:HBox xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" xmlns:mx="library://ns.adobe.com/flex/mx" width="100%" height="100%" implements="mx.controls.listClasses.IDropInListItemRenderer"&gt; &lt;fx:Script&gt; &lt;![CDATA[ import mx.controls.listClasses.BaseListData; import components.MyList; private var _listData:BaseListData; public function get listData() : BaseListData { return _listData; } public function set listData( value:BaseListData ) : void { _listData = value; } protected function button1_clickHandler(event:MouseEvent):void { dispatchEvent(new Event('hairEvent',true)); } override public function set data(value:Object):void { super.data = value; var criteria:Number = (listData.owner as MyList).criteria; hairClr.setStyle('color',data.hair); if(data.age &lt; criteria) alpha = 0.4; else alpha = 1; } ]]&gt; &lt;/fx:Script&gt; &lt;s:Button click="button1_clickHandler(event)" label="Button" /&gt; &lt;s:Label id="hairClr" text="Color" /&gt; &lt;/mx:HBox&gt; </code></pre>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload