Re:Item renderer AS3 for datagrid

I am having a data grid with multiple check boxes for this i am using CheckCellRendererEdit as itemrenderer.When i am making a change in datagrid checkbox its not updating
The problems are
1. when i select a checkbox in second row it gets selected in another row after saving
2.when i choose one checkbox in a row it gets afftected in many row can i get a solution for this Below given is the code i am using
CheckCellRendererEdit.as
package
    import mx.controls.*;
import mx.core.*;
import mx.controls.dataGridClasses.DataGridListData;
import flash.events.Event;
import flash.events.MouseEvent;
public class CheckCellRendererEdit extends CheckBox
// Define the constructor and set properties.
public function CheckCellRendererEdit() {
    super();
override protected function clickHandler(event:MouseEvent):void
            if (!enabled)
            {    //DataGrid(this.parentDocument.dg).selectedItem.vdata=CheckBox(event.currentTarget).selec ted;
                    event.stopImmediatePropagation();
                    return;
            if (toggle)
                selected = !selected;

Currently i am migrating from flex1.5 to flex2 Just i am using this itemrenderer(checkbox) for DataGrid can i have some ideas for datagrid
The DataGrid i am using is
<mx:DataGrid id="screendg" ">
            <mx:columns>
              <mx:Array>
                <mx:DataGridColumn headerText="mdata" dataField="screenid" editable="false" />
                <mx:DataGridColumn headerText="data" dataField="mdata" itemRenderer="CheckCellRendererEdit" />
                <mx:DataGridColumn headerText="mdata" dataField="vdata" itemRenderer="CheckCellRendererEdit" />
                <mx:DataGridColumn headerText="cdata" dataField="cdata" itemRenderer="CheckCellRendererEdit" />
                <mx:DataGridColumn headerText="vdata" dataField="udata" itemRenderer="CheckCellRendererEdit" />
            </mx:Array>
            </mx:columns>
          </mx:DataGrid>
When i am selecting a checkbox in data grid the grid value is not getting changed

Similar Messages

How to dispatch custom events from an item renderer used for Datagrid Column

Hi,
I am using an Item Renderer for a Data Grid Column and in that mxml, I am dispatching a custom event with data.
But the main mxml which has the DataGrid is not able to resolve the event. How can I solve this?
Thanks

Hi,
This is the constructor for Event.
public function Event(type:String, bubbles:Boolean = false, cancelable:Boolean = false)
When you created your custom event after extending from Event, for the parent container receives the event, the bubbles property must be set to true.
Please check if you have done so. That should solve the problem. Let me know if it doesn't.
Nishad

Using a bitmap object as a item renderer in a datagrid

I have a UIComponent grabbed has a bitmap, and stored in an
array collection.
I want to display a thumbnail in a datagrid, I can make a
itemRenderer for an image with a local or remote file as a source.
But how do I use the bitmap in the array collection in an item
renderer.
Thanks
Dean

Here is an example with a HorizontalList:
<?xml version="1.0" ?>

<mx:VBox xmlns:mx="
http://www.adobe.com/2006/mxml"
horizontalAlign="center"
verticalGap="0" borderStyle="none" backgroundColor="white"
>
<mx:Image id="image" width="60" height="60"
source="{data.image}"/>
<mx:Label text="{data.name}" width="120"
textAlign="center"/>
<mx:Label text="${data.price}" fontWeight="bold"/>
</mx:VBox>
<?xml version="1.0"?>

<mx:Application xmlns:mx="
http://www.adobe.com/2006/mxml">
<mx:Model id="catalog" source="catalog.xml"/>
<mx:HorizontalList id="myList"
columnWidth="125"
rowHeight="125"
columnCount="4"
dataProvider="{catalog.product}"
itemRenderer="myComponents.Thumbnail"/>
<mx:LinkButton label="Product images courtesy of Lavish"
click="navigateToURL(new URLRequest('
http://www.shoplavish.com'),
'_blank')"/>
</mx:Application>
<?xml version="1.0"?>
<catalog>
<product id="1">
<name>USB Watch</name>
<price>129.99</price>
<image>assets/products/usbwatch.jpg</image>
<thumbnail>assets/products/usbwatch_sm.jpg</thumbnail>
</product>
<product id="2">
<name>007 Digital Camera</name>
<price>99.99</price>
<image>assets/products/007camera.jpg</image>
<thumbnail>assets/products/007camera_sm.jpg</thumbnail>
</product>
<product id="3">
<name>2-Way Radio Watch</name>
<price>49.99</price>
<image>assets/products/radiowatch.jpg</image>
<thumbnail>assets/products/radiowatch_sm.jpg</thumbnail>
</product>
<product id="4">
<name>USB Desk Fan</name>
<price>19.99</price>
<image>assets/products/usbfan.jpg</image>
<thumbnail>assets/products/usbfan_sm.jpg</thumbnail>
</product>
<product id="5">
<name>Caffeinated Soap</name>
<price>19.99</price>
<image>assets/products/soap.jpg</image>
<thumbnail>assets/products/soap_sm.jpg</thumbnail>
</product>
<product id="6">
<name>Desktop Rovers</name>
<price>49.99</price>
<image>assets/products/rover.jpg</image>
<thumbnail>assets/products/rover_sm.jpg</thumbnail>
</product>
</catalog>

Item Renderer in a Datagrid

I'm struggling with how to make a check mark ( image ) show
up or not based on the value of some data in each datagrid line
item. I'm using an item renderer but I'm missing something. Any
help would be greatly appreciated.
thanks,
STeveR

The following is my entire itemrenderer...please excuse any
bad style as this is a WIProgress..
Its probably easier to quote the adobe docs on listdata...If
a component implements the IDropInListItemRenderer interface, you
can use its listData property to obtain information about the data
passed to the component when you use the component in an item
renderer or item editor..I made sure the component implements the
interface as you can see in the code at the top of component. Then
add the couple of required functions regarding listdata, then you
can access the listdata in your own functions in the renderer, like
i do in set data function.
this.BTN_***_mark.label =
value[DataGridListData(listData).dataField];
this line assigns the value from my datagrid to the renderers
button label. (this renderer is a button that the user can press)
so i want the buttons label to show the value coming in from the
datagrid. So listdata is just a way to
explicitly get the column name where the current data is
being sourced from in your datagrid.As the grid is being rendered,
it renders row by row. In each row it goes thru your columns . SO
initially it for row 1 it would begin rendering firstname, surname,
mark, average...etc etc. If i put an alert in on
value[DataGridListData(listData).dataField
I would see these column names popping up as they are getting
rendered in the DGrid.
Hope this helps...

<mx:VBox xmlns:mx="
http://www.adobe.com/2006/mxml"
creationComplete="init()" width="74" height="30"
horizontalAlign="center" verticalAlign="middle"
implements="mx.core.IFactory,mx.controls.listClasses.IDropInListItemRenderer">
<mx:Metadata>
</mx:Metadata>
<mx:Script>
<![CDATA[
import mx.managers.PopUpManager;
import mx.controls.DataGrid;
import mx.utils.ArrayUtil;
import mx.collections.ArrayCollection;
import mx.collections.IViewCursor;
import mx.controls.Alert;
import mx.events.*;
import mx.controls.dataGridClasses.DataGridListData;
import mx.controls.listClasses.BaseListData;
import mx.controls.dataGridClasses.DataGridColumn;
import mx.containers.TitleWindow;
private var panel:AssessmentMarkPopup = new
AssessmentMarkPopup();
var the_val = 0;
var col_index:int;
private var _listData:BaseListData;
public function get listData() : BaseListData
return _listData;
public function set listData( value:BaseListData ) : void
_listData = value;
private function showLoginForm():void {
var pop:AssessmentMarkPopup =
AssessmentMarkPopup(PopUpManager.createPopUp(this,AssessmentMarkPopup,true));
pop.addEventListener("closepopup",onClose);
pop.TXT_***_mark.text = this.BTN_***_mark.label;
var row:int =
this.parentApplication.DG_class_students.selectedIndex;
pop.student_name =
this.parentApplication.DG_class_students.selectedItem.firstname + "
" + this.parentApplication.DG_class_students.selectedItem.lastname;
private function onClose(e:MyClosePopupEvent):void{
this.BTN_***_mark.label = e.data.mark;
public function newInstance():*
return new MarkEntry();
public override function get data():Object
return super.data;
override public function set data(value:Object):void {
var dg:DataGrid = (listData) ? DataGrid(listData.owner) :
null;
var column:DataGridColumn = (dg) ?
dg.columns[listData.columnIndex] as DataGridColumn : null;
col_index = listData.columnIndex;
var str:String = String(column.dataField);
this.BTN_***_mark.label =
value[DataGridListData(listData).dataField];
]]>
</mx:Script>
<mx:Button click="showLoginForm()" id="BTN_***_mark"
width="52"/>
</mx:VBox>

Image in item renderer issue for List Components

Hello,
I have an issue when I use an item renderer with an image in
it. This happens when I do this with a List or TileList component
that has enough items to create a scroll bar. What happens is the
images load fine, then I scroll down and the other items and their
images start appearing, but then the first and last images start
loading the wrong image. I'll scroll back up and the first item now
has a different image, and when I scroll back down, the last images
changes too.
Has anyone had this problem with image itemrenderers in List
components?
Thanks for any help.
Brade

The creationComplete event is called ONCE and that's it. But
each time an itemRenderer is recycled it will have its data
property reset with new a new record from the dataProvider. Thus
overriding the set data function lets you inspect the data and do
what you want with it.
Data binding in MXML <mx:Image source="{data.image}" />
is set up by the Flex compiler. When the data property is reset it
will trigger the data binding notifications. The Flex
compiler-generated code will intercept that and update the Image
source property.
If you use MXML, then use data binding. If you write your
itemRenderer in ActionScript, override the set data
function.

Hiding item renders in Group Datagrid Label Rows?

I have an Advanced data grid displaying a grouped collection. I have an item renderer in one column the is a canvas with a button that is bound to the data.
However, buttons are also showing on the header rows, where they are not needed (see below). How do I fix this?

I have an Advanced data grid displaying a grouped collection. I have an item renderer in one column the is a canvas with a button that is bound to the data.
However, buttons are also showing on the header rows, where they are not needed (see below). How do I fix this?

Custom Item Renderer Issue for List

Hi,
I have a List that uses a custom renderer that contains a
combo box and a checkbox.
If i define the data provider inline in MXML both the
combobox and the checkbox render values correctly.
However, if I switch the dataprovider to an AS 3.0
ArrayCollection using same name/value pairs, the checkbox renders
properly but the combo box doesn't show text values. What is weird
is that if I trace the data, the value is accessible but it won't
show in combo.text of control.
Any ideas?

The creationComplete event is called ONCE and that's it. But
each time an itemRenderer is recycled it will have its data
property reset with new a new record from the dataProvider. Thus
overriding the set data function lets you inspect the data and do
what you want with it.
Data binding in MXML <mx:Image source="{data.image}" />
is set up by the Flex compiler. When the data property is reset it
will trigger the data binding notifications. The Flex
compiler-generated code will intercept that and update the Image
source property.
If you use MXML, then use data binding. If you write your
itemRenderer in ActionScript, override the set data
function.

Datagrid Drop Down Item renderer Scroll Problem

Hi,
I am having a problem with an drop down item renderer on a Datagrid. When ever the datagrid is displayed and the cell is clicked on i want this to display a drop down list of objects. I can get the drop down to appear with the list of objects. H
owever the scrollbar does not work on this item to allow the user to scroll through all the objects. If you use the mouse wheel you can scroll down through them all but not when you try and click on the scroll bar to drag down. Below is the code used. Any advice why this might be happening??
<mx:DataGridColumn headerText="Widget"
dataField="WidgetName"
editable="true" headerWordWrap="false" textAlign="center" width="100"
editorDataField="Widget">
<mx:itemEditor>
<fx:Component>
<s:MXDataGridItemRenderer focusEnabled="true" height="22" >
<fx:Script>
<![CDATA[
import mx.events.FlexEvent;
import spark.events.IndexChangeEvent;
private var selectedWidget:Widget = null;
public function get ccyPair():String {
return ddlCcyPairs.selectedItem.Widget;
override protected function commitProperties():void {
super.commitProperties();
trace("Commit .......");
protected function ddlCcyPairs_changeHandler(event:IndexChangeEvent):void {
for each(var ccyP:CurrencyPair in ddlCcyPairs.dataProvider) {
if (ccyP.ccyPair == ddlCcyPairs.selectedItem.ccyPair) {
selectedWidget = ccyP;
ddlCcyPairs.selectedItem = selectedWidget;
protected function ddlCcyPairs_creationCompleteHandler(event:FlexEvent):void {
for each(var ccyP:CurrencyPair in ddlCcyPairs.dataProvider) {
if (ccyP.ccyPair == data.ccyPairName) {
selectedWidget = ccyP;
ddlCcyPairs.selectedItem = selectedWidget;
]]>
</fx:Script>
<s:DropDownList id="ddlWidgets" width="100%"
dataProvider="{parentApplication.Widgets}"
labelField="name"
selectedItem="selectedWidget"
creationComplete="ddlWidgets_creationCompleteHandler(event)"
change="ddlWidgets_changeHandler(event)"/>
</s:MXDataGridItemRenderer>
</fx:Component>
</mx:itemEditor>
</mx:DataGridColumn>

Hi, Post a test code.... It will be a lot easier to help you Mich

Item renderer on DataGrid (not DataGridColumn)

It seems that all the published examples of using an item renderer on a DataGrid use the itemRenderer property of DataGridColumn.
I don't think I can do this because my columns are created at run time, depending on the contents of the data provider.
I have therefore tried to assign my item renderer (a subclass of Canvas) directly to the DataGrid.
1. This works in MXML when the renderer is inline.
2. It sees to work when the renderer is an Actionscript class assigned to the DataGrid's itemRenderer property.
3. It does NOT work when the renderer is Flex component assigned to the DataGrid's itemRenderer property. This compiler error is reported: Initializer for 'itemRenderer': cannot parse value of type mx.core.IFactory from text 'comp:CellRenderer'.
I prefer to use the last method. Is there a way to fix this error?
If not, is it possible to attach the item renderer to each DataGridColumn as it is created? DataGrid does not seem to have a suitable event that reports when a column is created.
Aplogies if this is elementary stuff. I am a real Flex newbie. I am using Flex Builder 3.0
Andy Kirkham

A code example would be helpful here, but from your error message it
looks like you may be doing the following
<mx:DataGrid itemRenderer="comp:CellRenderer"/>
Instead of this, you need to use the fully qualified class name of
CellRenderer, eg.
com.renderers.CellRenderer
Look at the definition of 'comp' towards the top of your MXML file, it
will be something like:
xmlns:comp="blah.blah.blah.*"
Your itemRenderer property should then be set to:
blah.blah.blah.CellRenderer

Datagrid item renderer destroys on mouse over

Hi,
     I used Flex 3.5 datagrid. I used item renderes in my datagrid. and i set 'rendererIsEditor = true'.
     Everything is very smooth and good. But somtimes my datagrid acting badly. When i put cursor on itemRenderer, It open-up for
editing. When i move mouse, item renderer destroyed.
     Once it happens it is the default behaviour of my datagrid. No editing can be performed.
      But i can not reproduce it always. sometimes it a happens.
      please help me. anybody know about this?

Simplify your test case. Try using a simple TextInput as the renderer and
see if you have the same problem.

Display item renderer in only some rows of a datagrid

I need to display a combobox item renderer in my datagrid
only in the first of every 5 rows. With the remaining 4 rows in
this particular column empty. Then the pattern will repeat again.
This is how I am currently creating the columns however with
this approach the combobox itemrenderer is appearing in all rows
<mx:columns>
<mx:DataGridColumn headerText="No."
dataField="assCriteriaNum" width="60" />
<mx:DataGridColumn headerText="Assessment Criteria"
dataField="assCriteria" width="210"/>
<mx:DataGridColumn headerText="Mark Range"
dataField="markRange" width="50" />
<mx:DataGridColumn headerText="Mark" dataField="mark"
width="70" >
<mx:itemRenderer>
<mx:Component>
<mx:ComboBox>
<mx:dataProvider>
<mx:ArrayCollection>
<mx:String>0</mx:String>
<mx:String>1</mx:String>
<mx:String>2</mx:String>
<mx:String>3</mx:String>
<mx:String>4</mx:String>
<mx:String>5</mx:String>
<mx:String>6</mx:String>
<mx:String>7</mx:String>
<mx:String>8</mx:String>
<mx:String>9</mx:String>
<mx:String>10</mx:String>
</mx:ArrayCollection>
</mx:dataProvider>
</mx:ComboBox>
</mx:Component>
</mx:itemRenderer>
</mx:DataGridColumn>
</mx:columns>

Here is my data provider hard coded
<mx:dataProvider>
<mx:ArrayCollection>
<mx:Array>
<mx:Object assCriteria="A01 Manage." />
<mx:Object assCriteriaNum="1" assCriteria="Brief project
plan, with little evidence of monitoring progress of project work
against the project plan." markRange="(1-3)" />
<mx:Object assCriteriaNum="2" assCriteria="Limited
identification of the topic to be investigated/ researched and
limited evidence of appropriate aims and objectives, and proposed
project title." markRange="(1-3)" />
<mx:Object assCriteriaNum="3" assCriteria="Project plan,
with some evidence of monitoring progress of project work against
the project plan." markRange="(4-6)" />
<mx:Object assCriteriaNum="4" assCriteria="Some
identification of the topic to be investigated/ researched and some
evidence of appropriate aims complete the work and objectives, and
proposed project title." markRange="(4-6)" />
<mx:Object assCriteriaNum="5" assCriteria="Detailed
project plan, with clear evidence of monitoring progress of project
work against the project plan." markRange="(7-10)" />
<mx:Object assCriteriaNum="6" assCriteria="Clear
identification of the topic to be investigated/ researched and
clear evidence of appropriate aims identify the topic and
objectives, and proposed project title." markRange="(7-10)" />
<mx:Object assCriteriaNum="7" assCriteria="No relevant
response." markRange="(0)" />
<mx:Object assCriteria="A02 Use resources/research."
/>
<mx:Object assCriteriaNum="8" assCriteria="Little or no
analysis and application of the research, with few links made to
appropriate theories and concepts." markRange="(1-5)" />
<mx:Object assCriteriaNum="9" assCriteria="Evidence of
limited research involving limited selection and evaluation of
sources." markRange="(1-5)" />
<mx:Object assCriteriaNum="10" assCriteria="Some analysis
and application of the research, with links made to appropriate
theories and concepts." markRange="(4-6)" />
<mx:Object assCriteriaNum="11" assCriteria="Evidence of
some research involving the selection analyse data and evaluation
of a range of relevant sources." markRange="(4-6)" />
<mx:Object assCriteriaNum="12" assCriteria="Critical
analysis and application of the research, with obtain and select
clear links made to appropriate theories and information from a
concepts. variety of sources." markRange="(7-10)" />
<mx:Object assCriteriaNum="13" assCriteria="Evidence of
detailed research involving the selection and evaluation of a wide
range of relevant sources." markRange="(7-10)" />
<mx:Object assCriteriaNum="14" assCriteria="No relevant
response." markRange="(0)" />
</mx:Array>
</mx:ArrayCollection>
</mx:dataProvider>

Item renderer issue

Hi,
I have a comboBox as item renderer in my datagrid (comboBox item renderer code bellow).
1. How can I remove the first blank item? My comboBox arrayCollection doesn't have 0 item.
2. If I come back to the cell that it was already selected with a value from my comboBox, how can I set the selected item of my comboBox to be the same as the previus value? If I leave the comboBox without selection it will be blank as the 0 element.
Please help.
Thanks
Johnny
<?xml version="1.0" encoding="utf-8"?>
<mx:ComboBox xmlns:mx="http://www.adobe.com/2006/mxml"
             labelField="label" dataProvider="{acCombo}" rowCount="20"
             change="onSelectionChange(event)" creationComplete="init()">
    <mx:Script>
        <![CDATA[
            import mx.collections.ArrayCollection;
            import mx.controls.dataGridClasses.DataGridListData;
            import mx.events.ListEvent;
            import mx.rpc.events.ResultEvent;
            [Bindable]private var acCombo:ArrayCollection = new ArrayCollection ([{id:1, label:"Item 01"},{id:2, label:"Item 02"},{id:3, label:"Item 03"},
                {id:4, label:"Item 04"},{id:5, label:"Item 05"}]);
            private var _ownerData:Object;
            public function init():void
                //init code
            override public function set data(value:Object):void
                if (value){
                    _ownerData = value as Object;
                    var col:DataGridListData = DataGridListData(listData);
                    var item:Object = new Object;
                    var clabel:String = value[col.dataField];
                    var cid:int = value.id;
                    item.label = clabel;
                    item.id = cid;
                    selectedItem = item;
            override public function get data():Object
                return _ownerData;
            override public function setFocus():void
                super.setFocus();
                open();
            private function onSelectionChange(e:ListEvent):void
                if(selectedItem && _ownerData){
                    var col:DataGridListData = DataGridListData(listData);
                    var clabel:String = selectedItem.label;
                    var cid:int = selectedItem.id;
                    _ownerData[col.dataField] = clabel;
                    _ownerData[id] = cid;
        ]]>
    </mx:Script>
</mx:ComboBox>

Hi,
I created a sample, maybe someone can see the issue for me
Thanks!
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical" viewSourceURL="srcview/index.html"
                creationComplete="init()">
    <mx:Script>
        <![CDATA[
            import mx.events.CollectionEvent;
            import mx.events.DataGridEvent;
            import com.myItemEditor;
            import mx.collections.ArrayCollection;
            [Bindable] private var acExecution:ArrayCollection = new ArrayCollection([
                {Territory:"Arizona", Territory_Rep:"Barbara Jennings", ITEM_ID:1, ITEM_NAME:"Item 01"},
                {Territory:"Central California", Territory_Rep:"Joe Smith", ITEM_ID:2, ITEM_NAME:"Item 02"},
                {Territory:"Nevada", Territory_Rep:"Bethany Pittman", ITEM_ID:2, ITEM_NAME:"Item 02"},
                {Territory:"Northern California", Territory_Rep:"T.R. Smith", ITEM_ID:1, ITEM_NAME:"Item 01"},
                {Territory:"Southern California", Territory_Rep:"Jane Grove", ITEM_ID:3, ITEM_NAME:"Item 03"}
            private function init():void
            private function onItemEditEnd(e:DataGridEvent):void
                var cEditor:myItemEditor = dgCustomEditor.itemEditorInstance as myItemEditor;
                var item:Object = cEditor.selectedItem;
                acExecution.refresh();
        ]]>
    </mx:Script>
    <mx:DataGrid id="dgCustomEditor" dataProvider="{acExecution}" height="160"
                 editable="true" itemEditEnd="onItemEditEnd(event)">
        <mx:columns>
            <mx:DataGridColumn headerText="Territory" dataField="Territory" width="60"
                               editable="false"/>
            <mx:DataGridColumn headerText="Territory Rep" dataField="Territory_Rep" width="60"
                               editable="false"/>
            <mx:DataGridColumn headerText="Item ID" dataField="ITEM_ID" width="60"
                               editable="false"/>
            <mx:DataGridColumn headerText="Item Name" dataField="ITEM_NAME" width="160" itemEditor="com.myItemEditor" />
        </mx:columns>
    </mx:DataGrid>
</mx:Application>
Item Editor component
<?xml version="1.0" encoding="utf-8"?>
<mx:ComboBox xmlns:mx="http://www.adobe.com/2006/mxml"
             labelField="LABEL" dataProvider="{acCombo}" rowCount="20"
             change="onSelectionChange(event)" creationComplete="init()">
    <mx:Script>
        <![CDATA[
            import mx.events.ListEvent;
            import mx.controls.dataGridClasses.DataGridListData;
            import mx.rpc.events.ResultEvent;
            import mx.collections.ArrayCollection;
            [Bindable]private var acCombo:ArrayCollection = new ArrayCollection ([{ID:1, LABEL:"Item 01"},{ID:2, LABEL:"Item 02"},{ID:3, LABEL:"Item 03"},
                {ID:4, LABEL:"Item 04"},{ID:5, LABEL:"Item 05"}]);
            private var _ownerData:Object;
            private function init():void
                //init code
            override public function set data(value:Object):void
                if (value){
                    _ownerData = value as Object;
                    var col:DataGridListData = DataGridListData(listData);
                    var item:Object = new Object;
                    var clabel:String = value[col.dataField];
                    var cid:int = value["ITEM_ID"];
                    item.LABEL = clabel;
                    item.ID = cid;
                    selectedItem = item;
            override public function get data():Object
                return _ownerData;
            override public function setFocus():void
                super.setFocus();
                open();
            private function onSelectionChange(e:ListEvent):void
                if(selectedItem && _ownerData){
                    var col:DataGridListData = DataGridListData(listData);
                    var clabel:String = selectedItem.LABEL;
                    var cid:int = selectedItem.ID;
                    _ownerData[col.dataField] = clabel;
                    _ownerData["ITEM_ID"] = cid;
        ]]>
    </mx:Script>
</mx:ComboBox>

Need for a Datagrid with variableRowHeight="true" and custom Item Renderer to display exact rows

Hi again, developers:
I'm in a search of a datagrid with certain characteristics:
     - variableRowHeight = "true"
     - only one column
     - each row must have a custom item renderer with possibly different heights, and a fixed width
     - the datagrid must show always every item in the data provider with no vertical scroll bars, what means that the datagrid height must have always the exact height sum of all the item renderers it is displaying.
     - and no extra empty rows must appear in the last positions of the datagrid
The last two requirements are something difficult to achieve... for some reason, empty rows appear at the last positions of the datagrid. I post what i've managed to get:
<mx:Script>
     <![CDATA[
     private function resize():void
                if (dg.dataProvider)
                    var h:Number = dg.measureHeightOfItems( -1, dg.dataProvider.length);
                    dg.height = h;
     ]]>
</mx:Script>
<mx:DataGrid id="dg" width="530" horizontalCenter="0" verticalScrollPolicy="off"
        dataProvider="{dp}"
        wordWrap="true" variableRowHeight="true" showHeaders="false" dataChange="resize()" height="{dg.measureHeightOfItems(-1,dg.dataProvider.length)}" click="Alert.show(dg.rowCount.toString());">
        <mx:columns>
            <mx:DataGridColumn headerText="ID" width="50">
                <mx:itemRenderer>
                    <mx:Component>
                        <mx:TextArea height="{Math.random()*100}" wordWrap="true" backgroundColor="{Math.random() * 16777216}" paddingTop="0" paddingBottom="0"/>
                    </mx:Component>
                </mx:itemRenderer>
            </mx:DataGridColumn>
        </mx:columns>
    </mx:DataGrid>

Thanks Harui, but it doesn't help. If the border is set it will help, but the very big problem is the empty rows that appear at the end of the datagrid... I can't find a way of measuring correctly the height of the itemRenderers!
I'll update this thread if I manage to do it.

Item Renderer for DataGrid

I have a button component as a Item renderer in the column of
the datagrid .
I am not able to access the Itemrenderer component(which I
declared in other mxml file in the datagrid)
This is the data grid where I have the Itemrenderer:
<mx:DataGrid id="dgCondition1"
variableRowHeight="true" width="100%" height="150"
verticalScrollPolicy="auto" editable="true"
dataProvider="{initDataGrid_Create}" >
<mx:columns>
<mx:DataGridColumn headerText="" dataField="conditi"
/>
<mx:DataGridColumn headerText="Condition"
dataField="syntax" width="300" />
<mx:DataGridColumn headerText="1" dataField="value"
width="80" editable="false" itemRenderer="buttonRenderer"/>
<mx:DataGridColumn dataField="value" headerText="2"
itemRenderer="buttonRenderer" />
I created a new mxml component for this button component
.(buttonRenderer.mxml)
<?xml version="1.0" encoding="utf-8"?>
<mx:VBox xmlns:mx="
http://www.adobe.com/2006/mxml"
width="400" height="300">
<mx:Script source="..TableDataGridBtn.as" />
<mx:Button id="col1" label="" width="75"
click="getDetail(event,col1)" />
</mx:VBox>
The Problem is I am not able to access the buttonRenderer in
the datagrid itemRenderer tag .
It says "Access of Undefined Property buttonRenderer".

"nash99" <[email protected]> wrote in
message
news:g7alc5$nkd$[email protected]..
> So
> Is it that I can Use this ItemRenderer tag in the
Application Tags only
> Is there any other way I can use them in mxml components
because I am
> using
> the same button in 16 datagrid columns , I dont wan't to
make the code
> look
> redundant.
http://www.adobe.com/livedocs/flex/3/html/help.html?content=intro_3.html

Two item renderer for one datagrid column?

hi
i have one doubt
can we use two item renderer for one datagrid column
any possibilities
why i am asking this because
during drag and drop i need one itemrenderer and during application initialization i need another itemrenderer
any possibilities
karthik.k

Hi,
I think your requirement can be completed by using ViewStack you can pass selected index to it according to requirement.
See:
<itemRenederer ...
     <viewstack selectedIndex = 0 ...>
          <vBox id="vBox1" >
                    Your 1st itemrenderer will come here....
          </vBox>
          <vBox id="vBox2" >
                    Your 2nd itemrenderer will come here....
          </vBox>
     </viewStack>
</itemRenederer>
You have to just toggle selectedIndex.
Thanks

Re:Item renderer AS3 for datagrid

Similar Messages

Maybe you are looking for