Tooltip on Data Grid Column in Flex

Hi

Sometime we face issues while aligning the text(text which gets cropped due to width of the grid) in the Data Grid due to UI space constraints. That time showing the data of the column in tool tips comes to very useful and UI space saver. In Flex Data Grid we can easily customize the Tooltips according to our need. But for that we need to specify tool tip functions.

The below code snippets shows a simple tool tip for data grid column. Only thing we need to do is to enable the attribute showDataTips=”true” on the Grid column.

DataGrid id=”gridId” width=”100%” height=”100%” dataProvider=”{myprovider}” rowHeight=”19″ fontSize=”10″ fontGridFitType=”pixel” editable=”true”>
<mx:columns>
DataGridColumn headerText=”Name” dataField=”name” editable=”false”/>
DataGridColumn  headerText=”Value” dataField=”value” editable=”false” showDataTips=”true” />
</mx:columns>
</mx:DataGrid>


Thanks
R Vashi

Advertisements

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