chg value of a RadNumericTextBox from elsewhere

3 posts, 1 answers
  1. Morten
    Morten avatar
    349 posts
    Member since:
    Jul 2012

    Posted 22 Nov 2008 Link to this post

    I'd like to change the value of a RadNumericTextBox clientside by clicking another page control:

    By control:
    <telerik:RadNumericTextBox id="txtQtyPoster" NumberFormat-DecimalDigits="0" NumberFormat-GroupSeparator="" runat="server" Type="Number" Skin="Vista" Width="30" Value="0" TabIndex="0"></telerik:RadNumericTextBox>

    Rendered to:
    <span id="ctl00_cph_cnt_txtQtyPoster_wrapper" class="radInput_Vista" style="white-space:nowrap;"><input type="text" id="ctl00_cph_cnt_txtQtyPoster_text" name="ctl00_cph_cnt_txtQtyPoster_text" class="radEnabledCss_Vista  inputCell" style="width:30px;" /><input style="visibility:hidden;margin:-18px 0 0 0;width:1px;height:1px;overflow:hidden;border:0;padding:0;" id="ctl00_cph_cnt_txtQtyPoster" value="" type="text" /><input style="visibility:hidden;margin:-18px 0 0 0;width:1px;height:1px;overflow:hidden;border:0;padding:0;" id="ctl00_cph_cnt_txtQtyPoster_Value" name="ctl00$cph_cnt$txtQtyPoster" value="" type="text" /><input id="ctl00_cph_cnt_txtQtyPoster_ClientState" name="ctl00_cph_cnt_txtQtyPoster_ClientState" type="hidden" /></span>

    My javascript:
    var Poster = document.getElementById("<%= txtQtyPoster.ClientID  %>");
    Poster.value == "0";

    Triying the code below I dont get the RadNumericTextBox object:
    var poster = $find("<%= txtQtyPoster.ClientID %>");
    Poster.value == "0";

    - when to use document.getElementById and $find?
    - what (if any) are the requirements of using $find?

  2. Answer
    Kevin Babcock
    Kevin Babcock avatar
    189 posts
    Member since:
    Mar 2007

    Posted 23 Nov 2008 Link to this post

    Hi Morten71,

    You should be able to get a reference to the client-side RadNumericTextBox object by using $find('<%= RadNumericTextBoxID.ClientID %>'). Once you have a reference to it, you can call set_value(value) to set a new value. Here is a quick example:

    <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="Telerik.Examples._Default" %> 
    <%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %> 
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" ""> 
    <html xmlns="" > 
    <head runat="server"
        <title>Example - Change RadNumericTextBox Value on the Client</title> 
        <form id="form1" runat="server"
            <telerik:RadScriptManager ID="RadScriptManager1" runat="server" /> 
            <telerik:RadCodeBlock ID="RadCodeBlock1" runat="server"
                <script type="text/javascript"
                    function changeValue() { 
                        var textbox = $find('<%= RadNumericTextBox1.ClientID %>'); 
            <telerik:RadNumericTextBox ID="RadNumericTextBox1" runat="server" 
            <asp:Button ID="Button1" runat="server" 
                Text="Change Value" 
                OnClientClick="changeValue(); return false;" /> 

    The difference between $get() and $find() is that $get() returns the DOM element that has the ID you provide, and $find() returns the client-side component associated with the id you provide. So if you want to get a reference to the client-side DOM element of the RadNumericTextBox, you would call $get(), and if you want to get a copy of the client-side RadNumericTextBox object (along with all it's built-in functionality), you would call $find(). If you'd like to read more about the differences between the two functions, check out Matt Berseth's blog post: The Ever-Useful $get and $find ASP.NET AJAX Shortcut Functions

    I hope this helps. Let me know if you have more questions.

    Kevin Babcock
  3. Morten
    Morten avatar
    349 posts
    Member since:
    Jul 2012

    Posted 24 Nov 2008 Link to this post

    Hi Kevin
    thanks, It works... it was a case of caseSensitivity (poster != Poster)
Back to Top