Getting refrences to RadBar's Controls using Javascript

3 posts, 1 answers
  1. Mike
    Mike avatar
    24 posts
    Member since:
    Feb 2008

    Posted 18 Jan 2010 Link to this post

    Hello!
    I have a aspx page like below which has a RadBar Control containing RadTextBoxes, Span tags with ID's and other Labels.
    I haven't succeeded to get reference to any of controls mentioned above.

    Could someone please tell how to get reference to RadBar's Controls using Javascript,

    Cheers Michael

    <telerik:RadPageView runat="server" ID="RadPageViewContacts">
    <table id="TableYhteystiedot" runat="server" cellpadding="0" cellspacing="0"
      width="100%">                    
       <tr>
         <td>&nbsp;</td>                        
        </tr>                 
       <tr>                   
        <td align="left">                     
          <asp:Button ID="ButtonContacts" runat="server"  width="100px"
             Text='Save Contacts'
             onclick="ButtonSaveContacts_Click" />                  
         </td>                         
            
        Fields here
       
       <telerik:RadPanelBar ID="RadPanelBarPersons" runat="server"
         Skin="Outlook" Width="100%" CausesValidation="False" >
       <CollapseAnimation Type="None" Duration="100" />
       <Items>
       <telerik:RadPanelItem Text='Person info' runat="server"
         Selected="true" PostBack="False" ImageUrl="img/ContactPerson.gif" Value="Items">
       <Items>
       <telerik:RadPanelItem PostBack="False">
       <ItemTemplate>
          <table id="TableContactPerson" runat="server" cellpadding="0" width="100%">                                                                                               
             <tr>
                <td class="ms-formlabel" style="width:185px">
                   <asp:Label ID="Label11" CssClass="ms-standardheader" runat="server"
                      Text='SocialSecurityID'>
                   </asp:Label>
                   <span id="SpanSocSecId" runat="server" class="ms-error">*</span>
                </td>
                <td colspan="4" class="ms-formbody">                          
                   <telerik:RadTextBox ID="RadTextBoxSocialSecurity" runat="server" Width="430px"
                     ValidationGroup="CPerson">
                   </telerik:RadTextBox>
                </td>              
             </tr>                                                                     
             <tr>
      
             More items
  2. Answer
    Shinu
    Shinu avatar
    17764 posts
    Member since:
    Mar 2007

    Posted 19 Jan 2010 Link to this post

    Hi Mike,

    Access the corresponding RadPanelItem (I set value for the item in order to get the reference to it) and then follow the client side code shown below.

    ASPX:
     
    <telerik:RadPanelItem Value="Item1" PostBack="False"
        <ItemTemplate> 
            <table id="TableContactPerson" runat="server" cellpadding="0" width="100%"
                <tr> 
                    <td class="ms-formlabel" style="width: 185px"
                        <asp:Label ID="Label11" CssClass="ms-standardheader" runat="server" Text='SocialSecurityID'
                        </asp:Label> 
                        <span id="SpanSocSecId" runat="server" class="ms-error">*</span> 
                    </td> 
                    <td colspan="4"
                        <telerik:RadTextBox ID="RadTextBoxSocialSecurity" runat="server" Width="430px"
                        </telerik:RadTextBox> 
                    </td> 
                </tr> 
            </table> 
        </ItemTemplate> 
    </telerik:RadPanelItem> 

    JavaScript:
     
    <script type="text/javascript"
        function getControls() { 
            var PanelBar = $find("<%=RadPanelBarPersons.ClientID %>"); 
            var item = PanelBar.findItemByValue('Item1'); 
            var textbox = item.findControl('RadTextBoxSocialSecurity'); // Use findControl for accessing Ajax controls 
            var label = $telerik.findElement(item.get_element(), "Label11"); // Code for accessing standard ASP.NET controls 
            label.innerHTML = "changed"
            textbox.set_value('changed'); 
        } 
    </script> 

    Hope this helps,
    Shinu.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Mike
    Mike avatar
    24 posts
    Member since:
    Feb 2008

    Posted 19 Jan 2010 Link to this post

    Thanks a lot for your snippets Shinu!
    It helped me to solve problem,

    Cheers,

    Michael
Back to Top