Show tooltip to step.

[Merin]

I am using a radslider with values 1 to 5 with1 step. I want to know whether I can give a tooltip for each step values.

Any suggestions/input?
Merin

[Princy]

Hi Merin,

Please try the following code snippet to show the tooltip for RadSlider.

ASPX:

<telerik:RadToolTip ID="RadToolTip1" runat="server" OffsetY="3" Position="TopCenter"
    ShowCallout="false" Height="20px" ShowEvent="fromcode" HideEvent="FromCode">
</telerik:RadToolTip>
<telerik:RadSlider runat="server" ID="RadSlider1" IsSelectionRangeEnabled="true"
    MinimumValue="0" MaximumValue="5" SmallChange="1" OnClientValueChanging="OnClientValueChanging"
    ShowDecreaseHandle="false" OnClientSlideStart="OnClientSlideStart" OnClientSlideEnd="OnClientSlideEnd"
    ShowIncreaseHandle="false">
</telerik:RadSlider>

JavaScript:

<script type="text/javascript">
    function OnClientValueChanging(sender, args) {
        if (!isSliding) return;
        var tooltip = $find("<%= RadToolTip1.ClientID %>");
        ResetToolTipLocation(tooltip);
        tooltip.set_text(args.get_newValue());
    }
    function OnClientSlideStart(sender, args) {
        isSliding = true;
        var tooltip = $find("<%= RadToolTip1.ClientID %>");
        ShowRadToolTip(tooltip, sender);
    }
    function OnClientSlideEnd(sender, args) {
        isSliding = false;
        var tooltip = $find("<%= RadToolTip1.ClientID %>");
        tooltip.hide();
    }
    function ShowRadToolTip(tooltip, slider) {
        var activeHandle = slider.get_activeHandle();
        if (!activeHandle) return;
        tooltip.set_targetControl(activeHandle);
        ResetToolTipLocation(tooltip);
    }
    function ResetToolTipLocation(tooltip) {
        if (!tooltip.isVisible())
            tooltip.show();
        else
            tooltip.updateLocation();
    }
</script>

Thanks,
Princy.