Show theme settings Shopping cart Download trialFree Trial
Change Theme Settings
Change Theme Settings
Show All Themes

Load Content on Demand

First Name 
Last Name 
Birth Date 
Hire Date 
NancyDavolio12/8/1970 12:00:00 AMSales Representative5/1/2014 12:00:00 AMMore Info...
AndrewFuller2/19/1974 12:00:00 AMVice President, Sales8/14/2014 12:00:00 AMMore Info...
JanetLeverling8/30/1985 12:00:00 AMSales Representative4/1/2014 12:00:00 AMMore Info...
MargaretPeacock9/19/1959 12:00:00 AMSales Representative5/3/2015 12:00:00 AMMore Info...
StevenBuchanan3/4/1977 12:00:00 AMSales Manager10/17/2015 12:00:00 AMMore Info...
MichaelSuyama7/2/1985 12:00:00 AMSales Representative10/17/2015 12:00:00 AMMore Info...
RobertKing5/29/1982 12:00:00 AMSales Representative1/2/2016 12:00:00 AMMore Info...
LauraCallahan1/9/1980 12:00:00 AMInside Sales Coordinator3/5/2016 12:00:00 AMMore Info...
AnneDodsworth1/27/1988 12:00:00 AMSales Representative11/15/2016 12:00:00 AMMore Info...

This demo illustrates how to create and populate a hint programmatically on the client side using our client-side functionality. A hint with the detailed information displays on the left of the cell when the user clicks any cell in the "Details" column.

The Register function is used to register a hint functionality for each cell in the specified column, and its first argument is a target element selector - '[data-visibleindex]'. It specifies that a hint displays for grid cells that have the "data-visibleindex" attribute. The onShowing client event is used to to provide the custom-generated content that is stored in the e.contentElement event argument. The position and triggerAction function's arguments specify the position of a hint and the action that triggers it.

Local Copy of this Demo
To inspect the source code for this demo on your machine, you must first install our components via the DevExpress Component Installer.
You can open a local copy of this online demo directly from this webpage (if using v20.2.8, 21.1.4 or higher).
Open CS Solution
The source code files for this demo are installed (by default) in the following directory:
\Users\Public\Documents\DevExpress Demos XX.X\Components\ASP.NET\CS\MVCxDockAndPopupsDemos