We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy.
Unfortunately, activation email could not send to your email. Please try again.

How to render customized Tooltip for one column which displays values of another column?

We may like to customize the default browser tooltip displayed in the grid columns which can be achieved using the ejTooltip control of Syncfusion.

Solution:

The default tooltip of the grid columns can be customized by using cssClass property of column for which we need customized tooltip.

JS:

 

MVC:

 

ASP.NET

 

In the dataBound event of the Grid, we need to render the ejTooltip control for the elements with class name “coltip”.

 

Note: We can also display another column value in the customized tooltip using the beforeOpen event of the ejTooltip control.

 

ScreenShot:

Article ID: Published Date: Last Revised Date: Platform: Control:
7128 10/25/2016 10/26/2016 ASP.NET MVC Grid
Tags:
Did you find this information helpful?
Comments
Todd Seidel Jan 11, 2018

This only appears to work for the first few pages of the grid.   The popup fails to open on rows further down the list even if page is turned off.   I tested under MVC with the generated grid example that uses the northwind db.   This fails even if I'm hard coding the content for the tooltip.   I'm just evaluated the tools, but not having this capability is a deal breaker.  Any ideas on how to fix this?

Also, a secondary issue when trying to display data from one of the columns in the toolbox is that the line with "args.event.target.closest" throws 0x800a01b6 - JavaScript runtime error: Object doesn't support property or method 'closest'.   Other browser do not have this issue.


Reply
Add Comment
You must log in to leave a comment

You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.