Try this...
Application:
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml";
layout="vertical">
<mx:Script>
<![CDATA[
private var dp:Array = [
{project: "1 - A Project", status_type: "Pending"},
{project: "2 - Another Project", status_type: "Active"},
{project: "3 - Yet Another Project", status_type: "In
Progress"},
{project: "4 - And Another Project", status_type:
"Inactive"}
];
]]>
</mx:Script>
<mx:DataGrid id="dg" initialize="dg.dataProvider = dp"
verticalAlign="middle" editable="true">
<mx:columns>
<mx:DataGridColumn headerText="Project"
dataField="project"/>
<mx:DataGridColumn headerText="Status"
dataField="status_type"
itemRenderer="ItemRenderers.ColorRenderer"
itemEditor="ItemRenderers.ComboBoxEditor"/>
</mx:columns>
</mx:DataGrid>
</mx:Application>
ItemRenderers.ColorRenderer.as:
package ItemRenderers
{
import mx.controls.Text;
import mx.controls.dataGridClasses.DataGridListData;
public class ColorRenderer extends Text
{
public function ColorRenderer()
{
super();
}
override public function set data(value:Object):void
{
super.data = value;
if(value != null)
{
var colorToSet:String;
text = value[DataGridListData(listData).dataField];
switch(text)
{
case "Active":
colorToSet = "#00FF00";
break;
case "Inactive":
colorToSet = "#FF0000";
break;
case "In Progress":
colorToSet = "#0000FF";
break;
case "Pending":
colorToSet = "#00FFFF";
break;
}
setStyle("color", colorToSet);
}
}
}
}
ItemRenderers.ComboBoxEditor.as:
package ItemRenderers
{
import mx.controls.ComboBox;
import mx.controls.dataGridClasses.DataGridListData;
public class ComboBoxEditor extends ComboBox
{
private static var comboBoxItems:Array = ["Active", "Inactive",
"In Progress", "Pending"];
public function ComboBoxEditor()
{
super();
dataProvider = comboBoxItems;
}
override public function set data(value:Object):void
{
super.data = value;
if(value != null)
{
selectedItem =
value[DataGridListData(listData).dataField];
}
}
}
}
--- In flexcoders@yahoogroups.com, "Goutham" <goldensu...@...> wrote:
>
> Hi,
>
> I am trying to color the text of a column based on conditions. I have
seen some examples, but they use the renderers.
>
> I have a datagrid with a column that has a combobox as a component
itemeditor, I want that column text to be colored based on conditions
>
> <datagrid id="myGrid>
> <columns>
>
> <datagridcolumn headerText="project" dataField="project" />
> <datagridcolumn headerText="status" dataField="status_type"
itemEditor="statuscombobox" editorDataField="newValue" />
>
> </columns>
> </datagrid>
>
>
> statuscombobox.mxml
>
> <vbox>
> <script>
> ....
> </script>
> <combobox id="cbStatus" />
> </vbox>
>
> I would like to have the text of column 'status' to be colored based
on conditions and when clicked on the column, the combobox shows up
(which need not be colored).
>
> Thank you,
> Goutham
>
