Viewing Individual Entry / MainMarch 17, 2005
I have heard this question many times and I don't think it is documented. If you want to change the color of an entire row within a Datagrid in Flex use the following code
dg.setPropertiesAt(2, {backgroundColor:0xFF0000});Where dg is your datagrid and the first parameter is the row of number you want to change
Comments
Ok it is work if i use a button (for example). But i want to change the color of an entire row in accordance with data of dataProvider Posted by Tirana at 3/22/05 7:28 AM
It would be great if this was documented because it's very useful. Why isn't in LiveDocs? Posted by Zach at 4/14/05 11:40 AM
How can I change it back to its original color after I've changed it dynamically? Also, how can I change the color of a chosen column? Thanks. Posted by nih at 11/8/05 11:53 AM
How to implement this in flex beta 2 ? Posted by stephane at 4/19/06 6:44 AM
setPropertiesAt is not defined for DataGrid (I am getting Compiler error). I am using Flex 2 Beta 2.
Is there anyone know any other way to change background color of DG row and column for Flex 2? Posted by Mustaq Pradhan at 4/20/06 7:43 PM
I'm looking for a quick fix for this too -- there's some pretty long workarounds available, but I can't find any documented features for easily changing the row color. Posted by Jay Proulx at 9/18/06 8:51 AM
Can't seem to find this in Flex 2 (release). Is there any equivalent approach available? Posted by CM at 10/4/06 3:06 PM
I am looking for this one too. There are solutions there but they seem to be quite elaborate and many deal with color changes in item renderers based on the data in the cell. I want to be able to change the color dynamically, on a click of another item. Could someone please post a solution if and when they find one...
Thanks in advance, Niyati Posted by Niyati at 10/9/06 3:42 PM
This is what I have been using and it works...a little long but effective.
<!--- onload function ---> function onFormLoad(){
var listener:Object = {};
//put the controls in scope to avoid calling _root
var grdPassdown:mx.controls.DataGrid = grdPassdown;
listener.modelChanged = function(evt):Void {
<!--- remove listener, so that we are not longer notified of model changes --->
grdPassdown.removeEventListener('modelChanged',listener);
<!--- select first item --->
var grdPassdown = grdPassdown; for(var i:Number = grdPassdown.length-1; i >= 0; i--)
{
var item:Object = grdPassdown.dataProvider[i];
grdPassdown.selectedIndex = i;
if (grdPassdown.dataProvider[grdPassdown.selectedIndex]['EVNT_TYP']=='Clearance'){ if (grdPassdown.dataProvider[grdPassdown.selectedIndex]['DISPO']=='PENDING'){
grdPassdown.setPropertiesAt([i], {backgroundColor:0xF7FFB7});
}
}
if (grdPassdown.dataProvider[grdPassdown.selectedIndex]['EVNT_TYP']=='Reportable Incident'){ if (grdPassdown.dataProvider[grdPassdown.selectedIndex]['DISPO']=='PENDING'){
grdPassdown.setPropertiesAt([i], {backgroundColor:0xEE2C2C});
}
}
} grdPassdown.selectedIndex = undefined;
}
grdPassdown.addEventListener('modelChanged',listener); }
I got some of this code from other blogs and put it all together. Thanks to everyone who contributed. Posted by Mark at 10/24/06 8:17 PM
This is an easy way to do this...not sure about performance impact however:
<mx:DataGridColumn dataField="name" sortable="false" headerText="Title"> <mx:itemRenderer>
<mx:Component>
<mx:Label opaqueBackground="{data.viewed > 0 ? '0xA2FEA2' : '0xFFFFFF'}" />
</mx:Component>
</mx:itemRenderer>
</mx:DataGridColumn> Posted by Dallas at 11/10/06 8:01 AM
I found this site which offers a rather nice workaround to the problem by extending the DataGrid class
http://www.switchonthecode.com/tutorials/flex-datagrid-goodies-row-color-and-others
I hope this helps you guys!
Kind regards - Thomas Posted by Thomas at 10/5/09 6:55 PM
|
