Referencing textbox within dynamically loaded user control

3 posts, 0 answers
  1. David
    David avatar
    16 posts
    Member since:
    Jan 2012

    Posted 25 Sep 2012 Link to this post

    I have an app that dynamically loads several different user controls into a Panel control defined in a content page.  This Panel control is registered in the AjaxSettings property of the RADAjaxManager defined in my Master page.  I followed the examples on the Telerik website.

    Inside one of these user controls (SearchName), is a RadTextBox (NameTextBox). If I reference that user control/textbox from the content page via,

    nameTextBox = $find(

     

    '<%= SearchName.FindControl("NameTextBox").ClientID %>');

     


    ...everything is fine.  I can even add a "add_keyPress" method to that textbox variable.

    The problem arises when I try to move this textbox reference from the content page to within the user control via,

    nameTextBox = $('#NameTextBox');

    ...and leave the variable itself (nameTextBox), defined in the content page as a global variable (I need to do things with it there). I'm trying to encapsulate as much as possible within the user control.

    For some reason, after the user contol is loaded...the "nameTextBox" variable within the content page no longer has any of the Telerik methods defined within it, e.g. add_keyPress. I get an "Object doesn't support this property or method" error when I try to add this method to the textbox variable, e.g.

    nameTextBox.add_keyPress(nameTextBox_KeyPress);

    It almost seems like this textbox object is the ASP textbox control...and not the RAD textbox control???  Any help would be appreciated.

  2. Vasil
    Admin
    Vasil avatar
    1632 posts

    Posted 28 Sep 2012 Link to this post

    Hi David,

    Even when you are in the content page, you need to use the ClientID and not the ServerID when you pass is in the JavaScript code.
    As you use this in your master page:
    <%= SearchName.FindControl("NameTextBox").ClientID %>
    In your content page you should use:
    <%= NameTextBox.ClientID %>


    All the best,
    Vasil
    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
  3. David
    David avatar
    16 posts
    Member since:
    Jan 2012

    Posted 28 Sep 2012 Link to this post

    Thanks Vasil!  That did it.

    As I mentioned earlier, my content page is dynamically loading various user controls into a container control (panel).  I couldn't use the following script within this content page because the user control (SearchName), might not have been the one that was loaded at the time,

    nameTextBox = $find(

     

    '<%= SearchName.FindControl("NameTextBox").ClientID %>');

     


    An exception error would be thrown.

    I couldn't quite figure out how to reference the server controls within the user control that was currently loaded.  So I took your suggestion and did the following (I don't know if this was what you intended me to do, or if it's the correct way to do it, but it works),

    In the actual user control (SearchName), I added the following markup,

    <

     

     

    telerik:RadTextBox ID="NameTextBox" runat="server" Width="80px"></telerik:RadTextBox>

     

    <

     

     

    script type="text/javascript">

        nameTextBox =

     

    "<%= NameTextBox.ClientID %>";

     

    </

     

     

    script>

    Then in the content page where this user control is dynamically loaded, I added the following global variable,

     

    var nameTextBox;

    ...and added the following to the pageLoad() function,

    nameTextBox = $find(nameIDTextBox);


    Now, nameTextBox is pointing to the correct object, and I can assign event handlers (e.g. add_keyPress)...or get the contents of the textbox.  Again, not sure if this is the correct way to do this, but...
Back to Top