Show numbers (large and small step)

2 posts, 0 answers
  1. Voss Grose
    Voss Grose avatar
    81 posts
    Member since:
    Sep 2012

    Posted 10 Jan 2009 Link to this post

    I'm confused on how to setup my slider control to do the following:

    1. I want to display each value (-10 - 10).
    2. I want to be able to click on any number and have the slider slide directly to that value.
    3. The Inox skin must have a formatting bug because the tick lines extend to far down over the number values.

    I would think they must be a way to do want I want because I would guess it's the most common requirement.

    I basically want a combo of these 2 examples (small and large change)

  2. Tsvetie
    Tsvetie avatar
    1517 posts

    Posted 12 Jan 2009 Link to this post

    Hello Voss Grose,
    With the current version of the RadSlider, you cannot achieve the described result because you cannot configure the RadSlider to display numbers for its SmallChange values. Currently, you can:
    1. Display ticks for SmallChnage values
    2. Display ticks with labels (numbers) for LargeChange values

    However, you can use RadSlider items and style the items per your requirements. For example:
    <telerik:RadSlider runat="server" ID="RadSlider2" Orientation="Horizontal" Width="750" 
        Height="60" TrackPosition="Center" ItemType="Item" Skin="Web20" Value="2"  
            <telerik:RadSliderItem Text="1" Value="1" ToolTip="1 out of 10" runat="server"></telerik:RadSliderItem> 
            <telerik:RadSliderItem Text="2" Value="2" ToolTip="2 out of 10" runat="server"></telerik:RadSliderItem> 
            <telerik:RadSliderItem Text="3" Value="3" ToolTip="3 out of 10" runat="server"></telerik:RadSliderItem> 
            <telerik:RadSliderItem Text="4" Value="4" ToolTip="4 out of 10" runat="server"></telerik:RadSliderItem> 
            <telerik:RadSliderItem Text="5" Value="5" ToolTip="5 out of 10" runat="server"></telerik:RadSliderItem> 
            <telerik:RadSliderItem Text="6" Value="6" ToolTip="6 out of 10" runat="server"></telerik:RadSliderItem> 
            <telerik:RadSliderItem Text="7" Value="7" ToolTip="7 out of 10" runat="server"></telerik:RadSliderItem> 
            <telerik:RadSliderItem Text="8" Value="8" ToolTip="8 out of 10" runat="server"></telerik:RadSliderItem> 
            <telerik:RadSliderItem Text="9" Value="9" ToolTip="9 out of 10" runat="server"></telerik:RadSliderItem> 
            <telerik:RadSliderItem Text="10" Value="10" ToolTip="10 out of 10" runat="server"></telerik:RadSliderItem> 

    As for the Inox skin, you can control how far the labels for the LargeStep values will be displayed from the track of the RadSlider, by setting correct Width and Height for the RadSlider.

    Kind regards,
    the Telerik team

    Check out Telerik Trainer, the state of the art learning tool for Telerik products.
  3. DevCraft R3 2016 release webinar banner
Back to Top