Adam Hubble
Top achievements
Rank 1
Rank 1
Adam Hubble
asked on 28 Apr 2009, 11:03 AM
Hi, I have seen accordians like this that fully expand (and therefore show all child options) if javascript is disabled on pageload.
e.g. http://www.projectseven.com/viewer/index.asp?demo=apm
Is this possible or is there a workaround with the telerik panelbar? I have someone asking if this can be done...
Thanks,
Matt
e.g. http://www.projectseven.com/viewer/index.asp?demo=apm
Is this possible or is there a workaround with the telerik panelbar? I have someone asking if this can be done...
Thanks,
Matt
4 Answers, 1 is accepted
0
Accepted
Hello Matt,
This can be easily achieved using a simple trick. By default, all panelbar items should be expanded, and you will have to collapse them on the client.
ASPX:
Code-behind:
Best wishes,
Paul
the Telerik team
Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.
This can be easily achieved using a simple trick. By default, all panelbar items should be expanded, and you will have to collapse them on the client.
ASPX:
| <html xmlns="http://www.w3.org/1999/xhtml"> |
| <head runat="server"> |
| <title></title> |
| </head> |
| <body> |
| <form id="form1" runat="server"> |
| <telerik:RadScriptManager runat="server" ID="RadScriptManager1"> |
| </telerik:RadScriptManager> |
| <script type="text/javascript"> |
| function pageLoad() { |
| var panel = $find("<%=RadPanelBar1.ClientID %>"); |
| for (var i = 0; i < panel.get_allItems().length; i++) { |
| if (panel.get_allItems()[i].get_items().get_count != 0) { |
| panel.get_allItems()[i].set_expanded(false); |
| } |
| } |
| } |
| </script> |
| <telerik:RadPanelBar ID="RadPanelBar1" runat="server"> |
| <Items> |
| <telerik:RadPanelItem runat="server" Text="Root RadPanelItem1"> |
| <Items> |
| <telerik:RadPanelItem runat="server" Text="Child RadPanelItem 1"> |
| </telerik:RadPanelItem> |
| <telerik:RadPanelItem runat="server" Text="Child RadPanelItem 2"> |
| <Items> |
| <telerik:RadPanelItem runat="server" Text="Child RadPanelItem 1"> |
| </telerik:RadPanelItem> |
| <telerik:RadPanelItem runat="server" Text="Child RadPanelItem 2"> |
| </telerik:RadPanelItem> |
| <telerik:RadPanelItem runat="server" Text="Child RadPanelItem 3"> |
| </telerik:RadPanelItem> |
| </Items> |
| </telerik:RadPanelItem> |
| </Items> |
| </telerik:RadPanelItem> |
| <telerik:RadPanelItem runat="server" Text="Root RadPanelItem2"> |
| <Items> |
| <telerik:RadPanelItem runat="server" Text="Child RadPanelItem 1"> |
| </telerik:RadPanelItem> |
| <telerik:RadPanelItem runat="server" Text="Child RadPanelItem 2"> |
| <Items> |
| <telerik:RadPanelItem runat="server" Text="Child RadPanelItem 1"> |
| </telerik:RadPanelItem> |
| <telerik:RadPanelItem runat="server" Text="Child RadPanelItem 2"> |
| </telerik:RadPanelItem> |
| <telerik:RadPanelItem runat="server" Text="Child RadPanelItem 3"> |
| </telerik:RadPanelItem> |
| </Items> |
| </telerik:RadPanelItem> |
| <telerik:RadPanelItem runat="server" Text="Child RadPanelItem 3"> |
| </telerik:RadPanelItem> |
| </Items> |
| </telerik:RadPanelItem> |
| </Items> |
| </telerik:RadPanelBar> |
| </form> |
| </body> |
| </html> |
Code-behind:
| 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; |
| public partial class _Default : System.Web.UI.Page |
| { |
| protected void Page_Load(object sender, EventArgs e) |
| { |
| foreach (RadPanelItem item in RadPanelBar1.GetAllItems()) |
| { |
| if (item.Items.Count != 0) |
| { |
| item.Expanded = true; |
| } |
| } |
| } |
| } |
Best wishes,
Paul
the Telerik team
Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.
0
Adam Hubble
Top achievements
Rank 1
Rank 1
answered on 01 May 2009, 09:58 AM
Awesome, thanks Paul - I think Telerik should build this in as a default behaviour really, or a behaviour that can be boolean'd.
0
Brian
Top achievements
Rank 1
Rank 1
answered on 12 Jun 2009, 07:19 PM
I attempted to use this code in a sharepoint master page. It didn't work. The panelbar sections remain in a unexpanded state. Can someone help me shed some light on this?
The code I am using is this:
When I attempt to debug this, the value being returned from "GetAllItems() is always 0. But it displays all of the menu items on the screen when it renders.
Any help would be greatly appreciated!
Brian
The code I am using is this:
<
script runat="server">
protected void Page_Load(object sender, EventArgs e)
{
foreach (RadPanelItem item in RadPanelBar1.GetAllItems())
{
if (item.Items.Count != 0)
{
item.Expanded =
true;
}
}
}
</
script>
When I attempt to debug this, the value being returned from "GetAllItems() is always 0. But it displays all of the menu items on the screen when it renders.
Any help would be greatly appreciated!
Brian
0
Hi Brian,
Declarative databinding (via DataSourceID) occurs later than Page_Load. The panelbar is just empty in this case. You can force databinding by calling the DataBind method of your panelbar before enumerating its items.
Sincerely yours,
Albert
the Telerik team
Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.
Declarative databinding (via DataSourceID) occurs later than Page_Load. The panelbar is just empty in this case. You can force databinding by calling the DataBind method of your panelbar before enumerating its items.
Sincerely yours,
Albert
the Telerik team
Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.