Make a range slider

2 posts, 1 answers
  1. stephane
    stephane avatar
    10 posts
    Member since:
    Jan 2010

    Posted 27 Jun 2014 Link to this post

    This code works for making a slider


    <script>
     $(document).ready(function () {
    var
    sliderTimePush = jQuery("#sliderTimePush").kendoSlider({
                    increaseButtonTitle: "Right",
                    decreaseButtonTitle: "Left",
                    showButtons: true,
                    min: 1,
                    max: 7,
                    largeStep: 1,
     
                    tooltip: {
                        enabled: false
                    },
                    orientation: "horizontal"
                });
     });
    </script>

      <input id="sliderTimePush" class="balSlider" value="0" />
    I try to do the same thing but for a range slider:


    <script>
     $(document).ready(function () {
    var sliderTimePush = jQuery("#sliderTimePush").kendoRangeSlider({
                    increaseButtonTitle: "Right",
                    decreaseButtonTitle: "Left",
                    showButtons: true,
                    min: 1,
                    max: 7,
                    largeStep: 1,
      
                    tooltip: {
                        enabled: false
                    },
                    orientation: "horizontal"
                });
     });
    </script>
     
      <input id="sliderTimePush" class="balSlider" value="0" />

    It doesn't works event with trivial way
    var sliderTimePush = jQuery("#sliderTimePush").kendoRangeSlider()({
        min: 0,
        max: 10,
        smallStep: 1,
        largeStep: 2,
        tickPlacement: "both"
    });

    Do you have idea how to do that? 
  2. Answer
    Alexander Valchev
    Admin
    Alexander Valchev avatar
    2875 posts

    Posted 01 Jul 2014 Link to this post

    Hello Stephane,

    Range Slider should be initialized from a <div> element that contains two input elements. For more details and code sample please check the getting started topic of the widget:

    Regards,
    Alexander Valchev
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
  3. Kendo UI is VS 2017 Ready
Back to Top