RadPanelBar inside of ASP DataList

2 posts, 0 answers
  1. Scott
    Scott avatar
    1 posts
    Member since:
    Sep 2011

    Posted 29 Sep 2011 Link to this post

    So I have a RadPanelBar inside of an ASP DataList, because of this I'm having problems with javascript not working properly.  Here is a code snipped, this is also inside of a content area of a master page.  The javascript methods for the RadPanelItem (getExpanded, expand, and collapse) are not functioning.  The RadPanelItem never collapses.  If the PanelBar is moved outside of the datalist then everything works.  If the RadPanelBar is inside of the dataList then the following javascript items no longer work correctly.
        $find - using clientID
        RadPanelItem methods - getExpanded, expand, and collapse

    <asp:DataList ID="dlDrugDetails" Runat="server" Width="100%" DataKeyField="OrderApplicantID" Visible="True" CellPadding="0" CellSpacing="0" 
    onitemcreated="dlDrugDetails_ItemCreated" OnItemDataBound="dlDrugDetails_ItemDataBound">
        <telerik:RadPanelBar ID="pbDrugs2" runat="server" Width="800px" OnClientLoad="pbDrugs2_OnLoad">
                <telerik:RadPanelItem Value="piDrugDetail" Expanded="false">
                        <Drugs:Message runat="server" id="UCDrugDetail"></Drugs:Message>

    Javascript code:

    var pbDrugs;
    var pbDrugs2;
    var isExpanded = true;
    function pageLoad() {
     //pbDrugs2 = document.getElementById("ctl00_bodyPlaceHolder1_dlDrugDetails_ctl00_pbDrugs2");
        pbDrugs = $find("<%= pbNotes.ClientID %>");  //attempting to find a panelbar within the datalist this way results in a compile error
    //this way seems to find the panel bar correctly
    function pbDrugs2_OnLoad(sender) {
        pbDrugs2 = sender;
    function toggleDrugSections() {
     var item = pbDrugs2.findItemByValue("piDrugDetail");
                if (item) {
                    //if (!item.get_expanded()) {  --this method is always returning true
                    if (!isExpanded) {   //replaced with javascript variable which does change
                        isExpanded = true;
                    else {
                        item.collapse();   //this never collapses the panel at all
                        isExpanded = false;
                else {
                    alert("Item not found.");
    //called from a different panelbar (inside the datalist as well).  Always getting called correctly. 
            function pbApplicantDetail_ItemClicked(sender, eventArgs) {
  2. Kate
    Kate avatar
    1898 posts

    Posted 04 Oct 2011 Link to this post

    Hi Scott,

    The code that you are using does not work since the ID of the control does not render in the same way when it is in a Template of a DataList. Therefore you will need a different approach for finding the PanelBar control when it is placed in a template. For example using the following code you can find any element that contains the pbDrugs2 letters (that is the id if the RadPanelBar) in its ID:
    <script type="text/javascript">
            function pbDrugs2_OnLoad(sender, args) {

    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
Back to Top