RadpanelBar Expand Collapse

4 posts, 0 answers
  1. Nishith
    Nishith avatar
    4 posts
    Member since:
    Sep 2011

    Posted 12 Oct 2011 Link to this post

    Hi I am using RadPanelBar and creating the HeaderTemplate dynamically and bind the data to it which is coming from database. If you see the attached screenshot the Root item "Channel Queue" has some child panel items and I want on click of header it should show all child items and if I click the header again it should collapse. Is it possible ?

    Now if I click the header for first time it is getting expanded and but on click of root panel it is not getting collapse. But it is getting collapsed only when i clicked other root items like (Case Identifier, Compliance or 2nd Level).

    Can we achieve this functionality either by using java script / code behind ? 

    Regards,
    Nishith
  2. Kate
    Admin
    Kate avatar
    1898 posts

    Posted 17 Oct 2011 Link to this post

    Hi Nishith,

    In general when you use a HeaderTemplate and a ContentTemplate of the RadPanelBar and have set the ExpandMode property to SingleExpandedItem  you can not collapse the root items on the second click but rather when a new root item is expanded. However, using the same property -  ExpandMode - and set it to MultipleExpandedItems you can achieve the desired functionality. You can refer to this demo and the attached runnable page for further reference.

    Kind regards,
    Kate
    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. UI for ASP.NET Ajax is Ready for VS 2017
  4. Nishith
    Nishith avatar
    4 posts
    Member since:
    Sep 2011

    Posted 17 Oct 2011 Link to this post

    Thanks for your reply.

    I am trying to follow the sample that you have attached in this reply. Only I had changed in the RadPanelBar DataBound Event, I am trying to set the HeaderTemplate for each RadPanelItem, but getting a null reference error. Whereas if I try to set ItemTemplate instead of HeaderTemplate it is working fine. But as per my requirement, I need to have a HeaderTemplate set for each Panel Item dynamically.

    I have attached the code here. Could you please hava a look and let me know what is going wrong here. Waiting for your response soon.

    Thanks,
    Nishith Ghoshal
    using System;
    using System.Collections.Generic;
    using System.Linq;
    using System.Web;
    using System.Web.UI;
    using System.Web.UI.WebControls;
    using Telerik.Web.UI;
    using Entities;
    using System.Data;
    using System.Web.UI.HtmlControls;
     
    public partial class UserControl_LeftNavigationUC : System.Web.UI.UserControl
    {
        public delegate void LeftNavigationClickHandler(object sender, RadPanelBarEventArgs e);
     
        private bool bIsChannel;
        public bool IsChannel
        {
            get
            {
                return bIsChannel;
            }
            set
            {
                bIsChannel = value;
            }
        }
     
        public IList<LeftNavigationItems> NavigationItems
        {
            set
            {
                if (value != null)
                {
                    if (bIsChannel)
                    {
                        var channelQueueItems = value.Where(t => t.IsChannelQueue);
                        rpbLeftNavigation.DataFieldID = "ID";
                        rpbLeftNavigation.DataFieldParentID = "ParentID";
                        rpbLeftNavigation.DataTextField = "Text";
                        rpbLeftNavigation.DataValueField = "Count";
                        rpbLeftNavigation.DataSource = channelQueueItems;
                        rpbLeftNavigation.DataBind();
                    }
                    else
                    {
                        var commonQueueItems = value.Where(t => !t.IsChannelQueue);
                        rpbLeftNavigation.DataFieldID = "ID";
                        rpbLeftNavigation.DataFieldParentID = "ParentID";
                        rpbLeftNavigation.DataTextField = "Text";
                        rpbLeftNavigation.DataValueField = "Count";
                        rpbLeftNavigation.DataSource = commonQueueItems;
                        rpbLeftNavigation.DataBind();
                    }
                }
            }
        }
     
        public void ClearSelectedItem()
        {
            foreach (RadPanelItem rpi in rpbLeftNavigation.Items)
            {
                rpi.Selected = false;
            }
        }
     
     
        /// <summary>
        /// Events
        /// </summary>
        public event LeftNavigationClickHandler leftNavigationClickHandler;
     
        protected void Page_Load(object sender, EventArgs e)
        {
             
        }
        /// <summary>
        /// Item click event
        /// </summary>
        /// <param name="sender"></param>
        /// <param name="e"></param>
        protected void rpbLeftNavigation_ItemClick(object sender, RadPanelBarEventArgs e)
        {
            if (this.leftNavigationClickHandler != null)
                leftNavigationClickHandler(sender, e);
        }
        protected void rpbLeftNavigation_ItemDataBound(object sender, RadPanelBarEventArgs e)
        {
            e.Item.Text = DataBinder.Eval(e.Item.DataItem, "Text").ToString();
            e.Item.Value = DataBinder.Eval(e.Item.DataItem, "Count").ToString();
        }
        protected void rpbLeftNavigation_DataBound(object sender, EventArgs e)
        {
            LeftNavHeaderTemplate headerTemplate = new LeftNavHeaderTemplate();
            foreach (RadPanelItem rpItem in rpbLeftNavigation.GetAllItems())
            {
                rpItem.HeaderTemplate = headerTemplate;
                headerTemplate.InstantiateIn(rpItem);
                rpItem.DataBind();
            }
        }
    }
     
     
    public class LeftNavHeaderTemplate : ITemplate
    {
        /// <summary>
        ///
        /// </summary>
        /// <param name="container"></param>
        public void InstantiateIn(Control container)
        {
            HtmlGenericControl div1 = new HtmlGenericControl("div");
            div1.Style.Add("float", "left");
            Label lblChannelName = new Label();
            lblChannelName.ID = "lblChannelId";
     
            lblChannelName.DataBinding += new EventHandler(lblChannelName_DataBinding);
            div1.Controls.Add(lblChannelName);
     
            container.Controls.Add(div1);
     
            HtmlGenericControl div2 = new HtmlGenericControl("div");
            div2.Style.Add("float", "right");
     
            RadButton btnCount = new RadButton();
            btnCount.ID = "btnCntButton";
            btnCount.DataBinding += new EventHandler(btnCount_DataBinding);
            btnCount.AutoPostBack = true;
            btnCount.Click +=new EventHandler(btnCount_Click);
            div2.Controls.Add(btnCount);
     
            container.Controls.Add(div2);
        }
        /// <summary>
        /// Data Binding
        /// </summary>
        /// <param name="sender"></param>
        /// <param name="e"></param>
        private void lblChannelName_DataBinding(object sender, EventArgs e)
        {
            Label lblChannelName = (Label)sender;
            RadPanelItem rpItem = (RadPanelItem)lblChannelName.BindingContainer;
            lblChannelName.Text = rpItem.Text;
        }
        /// <summary>
        ///
        /// </summary>
        /// <param name="sender"></param>
        /// <param name="e"></param>
        private void btnCount_DataBinding(object sender, EventArgs e)
        {
            RadButton btnCount = (RadButton)sender;
            RadPanelItem rpItem = (RadPanelItem)btnCount.BindingContainer;
            btnCount.Text = rpItem.Value;
        }
        /// <summary>
        /// button click event
        /// </summary>
        /// <param name="sender"></param>
        /// <param name="e"></param>
        private void btnCount_Click(object sender, EventArgs e)
        {
            //Button clicked event processing
        }
    }
  5. Kate
    Admin
    Kate avatar
    1898 posts

    Posted 20 Oct 2011 Link to this post

    Hi Nishith,

    This is a bug of the RadPanelBar that we are already aware of. It occurs when you create a HeaderTemplate in code behind and bind it to a data source. My apologies for the caused inconvenience. 

    Please let me know if I can assist you any further.

    Best wishes,
    Kate
    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