Slider with radnumerictextbox.

[Ivy]

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

[Shinu]

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.

[Ivy]

Thanks a lot. Perfectly answered.

[Ivy]

Hi shinu. Please help me to set blue color to the range selection.

[Shinu]

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.