How to insert a value the RadNumericTextBox to RadSlider?

[Patrik]

The project got a RadSlider, a RadNumericTextBox and a Label. Changing values ​​RadSlider the value shown in RadNumericTextBox, Label displays the function result (deposit + interest).

The problem is that I can not create an event that would change the values ​​in RadNumericTexBox (change clients) value delegated to RadSlider.

<script type="text/javascript">
        function ManualValueChange(sender, eventArgs) {
            $get("CalcSlider").value = sender.get_newValue();
        }
    </script>
    <telerik:RadAjaxManager ID="PpAjaxManager" runat="server">
        <AjaxSettings>
            <telerik:AjaxSetting AjaxControlID="CalcSlider">
                <UpdatedControls>
                    <telerik:AjaxUpdatedControl ControlID="CalcSliderDeposit" UpdatePanelRenderMode="Inline" />
                    <telerik:AjaxUpdatedControl ControlID="lblYouHave" UpdatePanelRenderMode="Inline" />
                    <telerik:AjaxUpdatedControl ControlID="lblprofit" UpdatePanelRenderMode="Inline" />
                </UpdatedControls>
            </telerik:AjaxSetting>
            <telerik:AjaxSetting AjaxControlID="CalcSliderDeposit">
                <UpdatedControls>
                    <telerik:AjaxUpdatedControl ControlID="CalcSlider" UpdatePanelRenderMode="Inline" />
                    <telerik:AjaxUpdatedControl ControlID="lblYouHave" UpdatePanelRenderMode="Inline" />
                    <telerik:AjaxUpdatedControl ControlID="lblprofit" UpdatePanelRenderMode="Inline" />
                </UpdatedControls>
            </telerik:AjaxSetting>
        </AjaxSettings>
    </telerik:RadAjaxManager>
   <div class="typeCalc">
                    <br />
                    <table style="width: 640px; margin: 0 auto;">
                        <tr>
                            <td colspan="2" style="height: 20px; text-align: center">
                                <h3>
                                    BondMarketers Invest Plan</h3>
                            </td>
                        </tr>
                        <tr>
                            <td colspan="2" style="height: 80px; border-top: 1px solid gray; text-align: center">
                                <telerik:RadSlider ID="CalcSlider" runat="server" Skin="Black" MinimumValue="0" MaximumValue="10000"
                                    LargeChange="2000" SmallChange="10" Width="650px" Height="65px" ItemType="Tick"
                                    TrackPosition="TopLeft" AnimationDuration="600" ShowDragHandle="false" OnValueChanged="CalcSliderValueChanged"
                                    AutoPostBack="true">
                                </telerik:RadSlider>
                            </td>
                        </tr>
                        <tr>
                            <td colspan="2" style="height: 20px">

                            </td>
                        </tr>
                        <tr>
                            <td style="width: 200px; text-align: center">
                                Invest:
                            </td>
                            <td>
                                <telerik:RadNumericTextBox runat="server" ID="CalcSliderDeposit" Type="Currency"
                                    Culture="en-US" DataType="System.Decimal" AutoPostBack="true">
                                    <ClientEvents OnValueChanged="ManualValueChange" OnLoad="ManualValueChange" />
                                </telerik:RadNumericTextBox>
                            </td>
                        </tr>
                        <tr>
                            <td colspan="2" style="height: 20px">

                            </td>
                        </tr>
                        <tr>
                            <td style="width: 200px; text-align: center">
                                <asp:Label runat="server" ID="lblYouHave" />
                            </td>
                            <td>
                                <asp:Label runat="server" ID="lblprofit" Font-Bold="True" Font-Size="Larger" ForeColor="Green" />
                            </td>
                        </tr>
                        <tr>
                            <td colspan="2" style="height: 20px">

                            </td>
                        </tr>
                    </table>
                </div>

Method to change the values​​:

protected void CalcSliderValueChanged(object sender, EventArgs e)
       {
           double percent = FormulaLayer.FormulaValue((decimal)CalcSlider.Value);
           decimal deposit = (decimal)CalcSlider.Value;
           int percents = 100;

           DateTime sDate = DateTime.Now;
           DateTime eDate = DateTime.Now.AddDays(365);

           CalcSliderDeposit.Value = Convert.ToDouble(deposit);


           lblYouHave.Text = "You have: ";

           lblprofit.Text = string.Format("${0}", ((Convert.ToDouble(deposit) / percents) * percent * Convert.ToDouble(FormulaLayer.GetWorkDayCount(sDate, eDate)) + Convert.ToDouble(CalcSlider.Value)));
       }

Thanks for any help.

Sorry for my bad english... :D

[Princy]

Hi Patrik,

Try the following code snippet to change the RadSlider value based on the value in the RadNumericTextBox.

JS:

<script type="text/javascript">
    function ManualValueChange(sender, eventArgs) {
        var CalcSlider = $find("<%= CalcSlider.ClientID %>");
        CalcSlider.set_value(sender.get_value());
    }
</script>

Hope this helps.

Thanks,
Princy.

[Patrik]

Hi Princy,

Thanks.