Slider with radnumerictextbox.

5 posts, 1 answers
  1. Ivy
    Ivy avatar
    30 posts
    Member since:
    Feb 2013

    Posted 09 Jul 2013 Link to this post

    Hi all

    Is it possible to integrate radslider with radnumerictextbox so that each work in a sync fashion. The value change gets reflected in both controls.

    Thanks
    Ivy
  2. Answer
    Shinu
    Shinu avatar
    17764 posts
    Member since:
    Mar 2007

    Posted 09 Jul 2013 Link to this post

    Hi Ivy,

    Your requirement is possible to achieve. Please have a look at the following code I tried which works fine at my end.

    ASPX:
    <telerik:RadNumericTextBox ID="RadNumericTextBox1" runat="server" ClientEvents-OnBlur="onblur">
    </telerik:RadNumericTextBox>
    <telerik:RadSlider ID="RadSlider" runat="server" MinimumValue="0" MaximumValue="100"
        LargeChange="25" SmallChange="25" OnClientValueChanged="OnClientValueChanged">
    </telerik:RadSlider>

    JavaScript:
    <script type="text/javascript">
        function OnClientValueChanged(sender, eventArgs) {
            var radnumerictextBox1 = $find("<%= RadNumericTextBox1.ClientID %>");
            radnumerictextBox1.set_value(sender.get_value());
        }
     
        function onblur(sender, args) {
            var slider = $find("<%= RadSlider.ClientID %>");
            slider.set_value(sender.get_value());
        }
    </script>

    Thanks,
    Shinu.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Ivy
    Ivy avatar
    30 posts
    Member since:
    Feb 2013

    Posted 09 Jul 2013 Link to this post

    Thanks a lot. Perfectly answered.
  5. Ivy
    Ivy avatar
    30 posts
    Member since:
    Feb 2013

    Posted 19 Jul 2013 Link to this post

    Hi shinu. Please help me to set blue color to the range selection.
  6. Shinu
    Shinu avatar
    17764 posts
    Member since:
    Mar 2007

    Posted 19 Jul 2013 Link to this post

    Hi Ivy,

    Try overriding the default CSS as follows.

    CSS:
    <style type="text/css">
        .RadSlider_Default .rslHorizontal .rslSelectedregion
        {
            background: none !important;
            background-color: Blue !important;
        }
    </style>

    Thanks,
    Shinu.
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017