Loading on Demand with AJAX in RadToolTip
Both RadTooltip and RadTooltipManager can display
rich content (including user controls and other ASP.NET controls).
RadTooltip
Rich content can be added to RadTooltip can be set to the tooltip
in two ways:
1. Declaring it between the opening and closing tags, e.g.:
<telerik:RadToolTip
runat="server"
ID="RadToolTip1" Width="250px" Height="300px"
>
Rich content:
<asp:Button ID="btnA"
runat="server"
Text="Button in a ToolTip"/>
</telerik:RadToolTip>
2. Adding controls from the code-behind to the RadToolTip.Controls
collection, e.g:
this.RadToolTip1.Controls.Add(new HtmlGenericControl("HR"));
RadTooltipManager
RadTooltipManager supports the OnAjaxUpdate
event, which triggers an AJAX call to the server when the user moves the mouse over
a particular tooltip element on the client.
The event handler receives the ID of the client element being hovered. This allows
for dynamically loading and displaying rich data content for a particular element
on demand.
The feature helps keep page sizes small and manageable, allowing for rich content
to be sent to the client only if requested.
The elements for which RadTooltipManager will throw an AJAX event
on the server must have their ClientID's added to the
TargetControls
collection.
<telerik:RadToolTipManager
runat="server"
ID="RadToolTipManager1"
Width="250px"
Height="300px"
Animation="Resize"
Sticky="true"
ManualClose="true"
OnAjaxUpdate="OnAjaxUpdate">
<TargetControls>
<telerik:ToolTipTargetControlTargetControlID="Link1" IsClientID="true"/>
<telerik:ToolTipTargetControl
TargetControlID="Link2" IsClientID="true"/>
</TargetControls>
</telerik:RadToolTipManager>
Target controls can also be added from the codebehind
in the following manner:
this.RadToolTipManager1.TargetControls.Add(image.ID);//The server ID is taken into consideration
this.RadToolTipManager1.TargetControls.Add(image.ClientID,
true);//The client
ID is taken into consideration