Tooltip on Expand/Collapse Button

[Kevin Neumann]

I have a page layout using the RadSplitter that consists of a left panel that can be collapsed. We want to collapse the side panel automatically on some pages (which I already know we can do), but we also want to let the user know that panel has been collapsed and that they can re-expand it if they want. Is there a way to add a RadTooltip to the expand/collapse button? I know you can have a standard browser on-hover tooltip, but we want something that we can pop open automatically on page load that says something like "Missing your sidebar? Click here to open it." and ideally have a button that says "Never show again" where we could store a value (in DB or cookie) to prevent the tooltip in the future.

[Vessy]

Hi Kevin,

In order to add a RadTooltip to the Collapse/Expand button you will need to go through the following steps:

• Set the target Splitbar's CollapseExpandPaneText=""
• Add a RadToolTip to your page
• Configure its Width, Height (recommended), IsClientId, VisibleOnPageLoad properties
• In the code behind set the Tooltip's TargetControlID to be equal to the Collapse/Expand button client ID

For example:

<telerik:RadToolTip ID="RadTooltip1" runat="server" RelativeTo="Element" Position="MiddleRight" IsClientID="true" Width="270px" Height="80px" VisibleOnPageLoad="true">
    Missing your sidebar? Click here to open it. <br />
    <asp:Button ID="Button1" runat="server" Text="Never show again"/>
</telerik:RadToolTip>

<telerik:RadSplitter ID="RadSplitter1" runat="server" Width="700px">
    <telerik:RadPane ID="RadPane1" runat="server" Width="200px" Collapsed="true"></telerik:RadPane>
    <telerik:RadSplitBar ID="RadSplitbar1" runat="server" CollapseMode="Backward" CollapseExpandPaneText=""></telerik:RadSplitBar>
    <telerik:RadPane ID="RadPane2" runat="server"></telerik:RadPane>
</telerik:RadSplitter>

CS:

protected void Page_Load(object sender, EventArgs e)
{
    RadTooltip1.TargetControlID = "RAD_SPLITTER_BAR_COLLAPSE_Forward_" + RadSplitbar1.ClientID;
    //OR
    //RadTooltip1.TargetControlID = "RAD_SPLITTER_BAR_COLLAPSE_Backward_" + RadSplitbar1.ClientID;
}

I hope this would be helpful for you.

Regards,
Veselina Raykova
the Telerik team

[Kevin Neumann]

PERFECT! Works like a charm.