Tooltip for DataGrid Column Elements.

Here itemRenderer comes into play.The below code will given on idea how this is achevied but you need to go through the Classes.

Flex App.mxml code

<?xml version=”1.0″ encoding=”utf-8″?>
<mx:TitleWindow xmlns:mx=”http://www.adobe.com/2006/mxml&#8221; layout=”absolute” width=”700″ height=”300″
creationComplete=”projectsSrv.send();”>
<mx:HTTPService
id=”projectsSrv”
url=”projects.php.xml”
useProxy=”false” method=”POST”>
</mx:HTTPService>
<mx:DataGrid  dataProvider=”{projectsSrv.lastResult.records.record}” width=”370″ x=”23″ y=”10″>
<mx:columns>
<mx:DataGridColumn dataField=”label”>
<mx:itemRenderer>
<mx:Component>
<mx:Label>
<mx:Script>
<![CDATA[
override public function set data(value:Object):void
{
super.data = value;
this.toolTip = data.label;
this.selectable = true;
super.invalidateDisplayList();
}
]]>
</mx:Script>
</mx:Label>
</mx:Component>
</mx:itemRenderer>
</mx:DataGridColumn>
</mx:columns>
</mx:DataGrid>
</mx:TitleWindow>

projects.php.xml code.

<records>
<record data=”1″ label=”Corco”/>
<record data=”5″ label=”Shell Crop Protection”/>
<record data=”7″ label=”Olin McIntosh”/>
<record data=”9″ label=”Crab Orchard”/>
<record data=”10″ label=”Shell Oil Del Amo”/>
<record data=”11″ label=”AIG South Jersey Gas”/>
<record data=”12″ label=”Husch &amp; Eppenberger Litigation-New York”/>
<record data=”22″ label=”Shell Sturbridge”/><record data=”24″ label=”Shell Southington”/>
<record data=”26″ label=”Olin Personal Injury”/>
</records>

The projects.php.xml is a xml file in the same directory. Now when you run the file you can see the Tooltip on the row element , similarly you can mention for other columns.

Enjoy the Post and code. Comment me for queries. 🙂

Advertisements

7 Responses to Tooltip for DataGrid Column Elements.

  1. […] View sample for “Tooltip for DataGrid Column Elements.” Post The actually post is made here. […]

  2. Kumar says:

    really awesome code

  3. JM says:

    if you want the Tooltip to appear only when the text in the grid is truncated your item renderer could be this:

  4. JM says:

    oups…

    the content of the item renderer can be:

  5. Excellent. Exactly what I was looking for. Thanks for sharing.

  6. Sanjay says:

    Exactly it really use full code..

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: