Hi All , In datagrid the tooltip will be displayed over the values .In order to show the tooltip at the right or without hiding the original value in the grid we shall use item renderer concept. Here is a simple example of that.
<mx:DataGrid width="99%" rowCount="10" id="queueList" itemClick="getid(event)" dataProvider="{planListValue.children()}" draggableColumns="false" styleName="DataGridStyle" left="5"
top="4" right="5">
<mx:columns>
<mx:Array>
<mx:DataGridColumn headerText="Item Name" dataField="@itemname" showDataTips="true">
<mx:itemRenderer>
<mx:Component>
<mx:Label>
<mx:Script>
<![CDATA[
import mx.controls.Alert;
override public function set data(value:Object):void
{
super.data=value;
this.toolTip=value.@itemname;
this.selectable=true;
super.invalidateDisplayList();
}
]]>
</mx:Script>
</mx:Label>
</mx:Component>
</mx:itemRenderer>
</mx:DataGridColumn>
<mx:DataGridColumn headerText="Type" dataField="@type" showDataTips="true" width="100">
<mx:itemRenderer>
<mx:Component>
<mx:Label>
<mx:Script>
<![CDATA[
import mx.controls.Alert;
override public function set data(value:Object):void
{
super.data=value;
this.toolTip=value.@type;
this.selectable=true;
super.invalidateDisplayList();
}
]]>
</mx:Script>
</mx:Label>
</mx:Component>
</mx:itemRenderer>
</mx:DataGridColumn>
<mx:DataGridColumn headerText="Plan" dataField="@planname" width="100" showDataTips="true">
<mx:itemRenderer>
<mx:Component>
<mx:Label>
<mx:Script>
<![CDATA[
import mx.controls.Alert;
override public function set data(value:Object):void
{
super.data=value;
this.toolTip=value.@planname;
this.selectable=true;
super.invalidateDisplayList();
}
]]>
</mx:Script>
</mx:Label>
</mx:Component>
</mx:itemRenderer>
</mx:DataGridColumn>
<mx:DataGridColumn headerText="Generation Date" width="150" dataField="@generationdate" headerWordWrap="true" showDataTips="true">
<mx:itemRenderer>
<mx:Component>
<mx:Label>
<mx:Script>
<![CDATA[
import mx.controls.Alert;
override public function set data(value:Object):void
{
super.data=value;
this.toolTip=value.@generationdate;
this.selectable=true;
super.invalidateDisplayList();
}
]]>
</mx:Script>
</mx:Label>
</mx:Component>
</mx:itemRenderer>
</mx:DataGridColumn>
<mx:DataGridColumn headerText="Last Printed" dataField="@lastPrinted" showDataTips="true">
<mx:itemRenderer>
<mx:Component>
<mx:Label>
<mx:Script>
<![CDATA[
import mx.controls.Alert;
override public function set data(value:Object):void
{
super.data=value;
this.toolTip=value.@lastPrinted;
this.selectable=true;
super.invalidateDisplayList();
}
]]>
</mx:Script>
</mx:Label>
</mx:Component>
</mx:itemRenderer>
</mx:DataGridColumn>
<mx:DataGridColumn headerText="Item Id" dataField="@itemid" visible="false" showDataTips="true">
<mx:itemRenderer>
<mx:Component>
<mx:Label>
<mx:Script>
<![CDATA[
import mx.controls.Alert;
override public function set data(value:Object):void
{
super.data=value;
this.toolTip=value.@itemid;
this.selectable=true;
super.invalidateDisplayList();
}
]]>
</mx:Script>
</mx:Label>
</mx:Component>
</mx:itemRenderer>
</mx:DataGridColumn>
<mx:DataGridColumn headerText="plantype" dataField="@plantype" visible="false" showDataTips="true">
<mx:itemRenderer>
<mx:Component>
<mx:Label>
<mx:Script>
<![CDATA[
import mx.controls.Alert;
override public function set data(value:Object):void
{
super.data=value;
this.toolTip=value.@plantype;
this.selectable=true;
super.invalidateDisplayList();
}
]]>
</mx:Script>
</mx:Label>
</mx:Component>
</mx:itemRenderer>
</mx:DataGridColumn>
<mx:DataGridColumn headerText="cron" dataField="@cronid" visible="false" showDataTips="true">
<mx:itemRenderer>
<mx:Component>
<mx:Label>
<mx:Script>
<![CDATA[
import mx.controls.Alert;
override public function set data(value:Object):void
{
super.data=value;
this.toolTip=value.@cronid;
this.selectable=true;
super.invalidateDisplayList();
}
]]>
</mx:Script>
</mx:Label>
</mx:Component>
</mx:itemRenderer>
</mx:DataGridColumn>
</mx:Array>
</mx:columns>
</mx:DataGrid>
top="4" right="5">
<mx:columns>
<mx:Array>
<mx:DataGridColumn headerText="Item Name" dataField="@itemname" showDataTips="true">
<mx:itemRenderer>
<mx:Component>
<mx:Label>
<mx:Script>
<![CDATA[
import mx.controls.Alert;
override public function set data(value:Object):void
{
super.data=value;
this.toolTip=value.@itemname;
this.selectable=true;
super.invalidateDisplayList();
}
]]>
</mx:Script>
</mx:Label>
</mx:Component>
</mx:itemRenderer>
</mx:DataGridColumn>
<mx:DataGridColumn headerText="Type" dataField="@type" showDataTips="true" width="100">
<mx:itemRenderer>
<mx:Component>
<mx:Label>
<mx:Script>
<![CDATA[
import mx.controls.Alert;
override public function set data(value:Object):void
{
super.data=value;
this.toolTip=value.@type;
this.selectable=true;
super.invalidateDisplayList();
}
]]>
</mx:Script>
</mx:Label>
</mx:Component>
</mx:itemRenderer>
</mx:DataGridColumn>
<mx:DataGridColumn headerText="Plan" dataField="@planname" width="100" showDataTips="true">
<mx:itemRenderer>
<mx:Component>
<mx:Label>
<mx:Script>
<![CDATA[
import mx.controls.Alert;
override public function set data(value:Object):void
{
super.data=value;
this.toolTip=value.@planname;
this.selectable=true;
super.invalidateDisplayList();
}
]]>
</mx:Script>
</mx:Label>
</mx:Component>
</mx:itemRenderer>
</mx:DataGridColumn>
<mx:DataGridColumn headerText="Generation Date" width="150" dataField="@generationdate" headerWordWrap="true" showDataTips="true">
<mx:itemRenderer>
<mx:Component>
<mx:Label>
<mx:Script>
<![CDATA[
import mx.controls.Alert;
override public function set data(value:Object):void
{
super.data=value;
this.toolTip=value.@generationdate;
this.selectable=true;
super.invalidateDisplayList();
}
]]>
</mx:Script>
</mx:Label>
</mx:Component>
</mx:itemRenderer>
</mx:DataGridColumn>
<mx:DataGridColumn headerText="Last Printed" dataField="@lastPrinted" showDataTips="true">
<mx:itemRenderer>
<mx:Component>
<mx:Label>
<mx:Script>
<![CDATA[
import mx.controls.Alert;
override public function set data(value:Object):void
{
super.data=value;
this.toolTip=value.@lastPrinted;
this.selectable=true;
super.invalidateDisplayList();
}
]]>
</mx:Script>
</mx:Label>
</mx:Component>
</mx:itemRenderer>
</mx:DataGridColumn>
<mx:DataGridColumn headerText="Item Id" dataField="@itemid" visible="false" showDataTips="true">
<mx:itemRenderer>
<mx:Component>
<mx:Label>
<mx:Script>
<![CDATA[
import mx.controls.Alert;
override public function set data(value:Object):void
{
super.data=value;
this.toolTip=value.@itemid;
this.selectable=true;
super.invalidateDisplayList();
}
]]>
</mx:Script>
</mx:Label>
</mx:Component>
</mx:itemRenderer>
</mx:DataGridColumn>
<mx:DataGridColumn headerText="plantype" dataField="@plantype" visible="false" showDataTips="true">
<mx:itemRenderer>
<mx:Component>
<mx:Label>
<mx:Script>
<![CDATA[
import mx.controls.Alert;
override public function set data(value:Object):void
{
super.data=value;
this.toolTip=value.@plantype;
this.selectable=true;
super.invalidateDisplayList();
}
]]>
</mx:Script>
</mx:Label>
</mx:Component>
</mx:itemRenderer>
</mx:DataGridColumn>
<mx:DataGridColumn headerText="cron" dataField="@cronid" visible="false" showDataTips="true">
<mx:itemRenderer>
<mx:Component>
<mx:Label>
<mx:Script>
<![CDATA[
import mx.controls.Alert;
override public function set data(value:Object):void
{
super.data=value;
this.toolTip=value.@cronid;
this.selectable=true;
super.invalidateDisplayList();
}
]]>
</mx:Script>
</mx:Label>
</mx:Component>
</mx:itemRenderer>
</mx:DataGridColumn>
</mx:Array>
</mx:columns>
</mx:DataGrid>
No comments:
Post a Comment