Display the current values

2 posts, 1 answers
  1. Jugoslav
    Jugoslav avatar
    74 posts
    Member since:
    Mar 2011

    Posted 12 May 2014 Link to this post

    May i use a range slider as shown on the attached image?
    Meaning both buttons should display their current position/value. 

    Thank you
  2. Answer
    Slav avatar
    1359 posts

    Posted 12 May 2014 Link to this post

    Hello Jugoslav,

    The RadSlider does not provide such functionality out-of-the-box, nevertheless it should be possible to achieve it by customizing the control a bit.

    First you can use the OnClientValueChanged event of the slider in order to track the changes in the values of the two drag handles: http://demos.telerik.com/aspnet-ajax/slider/examples/clientsideevents/defaultcs.aspx

    Then you can customize the appearance of the slider by creating a custom skin. You can check several examples in the following demo: http://demos.telerik.com/aspnet-ajax/slider/examples/customskins/defaultcs.aspx.

    Finally, the client-side object of the slider has a function get_dragHandles() that returns an array with the HTML elements of the slider's drag handles. When you have the elements of the handles, you can display the values within via JavaScript, for example by using innerHTML.
    var dragHandles = $find("<%= RadSlider1.ClientID %>").get_dragHandles(); // RadSlider1 is the ID of the slider control


    Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

Back to Top