This is a migrated thread and some comments may be shown as answers.

Can PanelBar load different aspx pages?

5 Answers 88 Views
PanelBar
This is a migrated thread and some comments may be shown as answers.
AL
Top achievements
Rank 1
AL asked on 12 Jan 2009, 09:39 PM
Hi,

I am creating survey site, and would love to use Telerik Controls (as they are GREAT). I just don't know how to use PanelBar to load different ASPX pages (NOT UserControls: I am fed up with usercontrols as it is very difficult to call javascript functions).

For example: I have a PanelBar in an aspx page. CLicking one of the items in PanelBar redirects the user to different aspx page. When the new aspx page loads, I want the panelBar to show up with the selected (highlighted) link, that brought the user here in first place.

Thanks,

5 Answers, 1 is accepted

Sort by
0
Serrin
Top achievements
Rank 1
answered on 13 Jan 2009, 02:26 PM
Hey Al,

Here's an example of how you can do this with a little code-behind magic...

Here's RadPanelNavTest-A.aspx:

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="RadPanelNavTest-A.aspx.cs" Inherits="RadPanelNavTest_A" %> 
 
<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %> 
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
 
<html xmlns="http://www.w3.org/1999/xhtml">  
<head runat="server">  
    <title></title>  
</head> 
<body> 
    <form id="form1" runat="server">  
    <div> 
        <telerik:RadScriptManager ID="RadScriptManager1" runat="server">  
        </telerik:RadScriptManager> 
        <telerik:RadPanelBar ID="RadPanelBar1" runat="server">  
            <CollapseAnimation Type="None" Duration="100"></CollapseAnimation> 
 
            <Items> 
                <telerik:RadPanelItem runat="server" Text="Home">  
                    <Items> 
                        <telerik:RadPanelItem runat="server" Text="Child1" NavigateUrl="RadPAnelNavTest-B.aspx?tgt=Child1">  
                        </telerik:RadPanelItem> 
                        <telerik:RadPanelItem runat="server" Text="Child2" NavigateUrl="RadPAnelNavTest-A.aspx?tgt=Child2">  
                        </telerik:RadPanelItem> 
                        <telerik:RadPanelItem runat="server" Text="Child3">  
                        </telerik:RadPanelItem> 
                    </Items> 
                </telerik:RadPanelItem> 
                <telerik:RadPanelItem runat="server" Text="Not Home">  
                    <Items> 
                        <telerik:RadPanelItem runat="server" Text="Child4">  
                        </telerik:RadPanelItem> 
                        <telerik:RadPanelItem runat="server" Text="Child5">  
                        </telerik:RadPanelItem> 
                        <telerik:RadPanelItem runat="server" Text="Child6">  
                        </telerik:RadPanelItem> 
                    </Items> 
                </telerik:RadPanelItem> 
            </Items> 
 
        <ExpandAnimation Type="None" Duration="100"></ExpandAnimation> 
        </telerik:RadPanelBar> 
    </div> 
    </form> 
</body> 
</html> 
 

And the .cs backend:
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 System.Drawing;  
 
public partial class RadPanelNavTest_A : System.Web.UI.Page  
{  
    protected void Page_Load(object sender, EventArgs e)  
    {  
        if (Request["tgt"] != null)  
        {  
            string panelTarget = Request["tgt"].ToString();  
 
            RadPanelItem rpi = RadPanelBar1.FindItemByText(panelTarget);  
 
            rpi.BackColor = Color.CornflowerBlue;  
 
            RadPanelItem parentOfrpi = rpi.Parent as RadPanelItem;  
 
            parentOfrpi.Expanded = true;  
        }  
    }  
}  
 

Now also make an additional RadPanelNavTest-B.aspx with the same RadPanel setup and the same Page_Load logic in the code-behind.  The logic here is...

  • RadPanelItem's can be id'd by their .Text property, so...
  • Pass their text item as a tgt argument in the url
  • Grab that argument (if it exists, that is)
  • Find the item in the root RadPanelBar
  • Give it a nice backcolor (or you can do css here, your call)
  • Last but not least, find the parent RadPanelItem and set it to expanded so you can see the fruits of your labor

Let me know if that works for you. :)

-Serrin

 

P.S.- I took a break from what I was working on this morning to figure this out as I share your hatred for usercontrols. ;D

0
Serrin
Top achievements
Rank 1
answered on 13 Jan 2009, 02:28 PM
Eep, one more thing, since I'm a moron and went for the easiest and first thing that came to mind for example sakes, you can also set the .Value of the RadPanelItems and use .FindPanelByValue.  Probably a prettier option if you're using anything beyond one-word .Text properties. :)

Cheers!
0
AL
Top achievements
Rank 1
answered on 13 Jan 2009, 04:22 PM
Thanks Serrin. I tried your code and suggestion, and it worked. This means I have to replicate the same panelBar code in 40 - 50 aspx survey pages! There must be a better ways to accomplish it, I am now thinking of using RadSplitter, where I have the PanelBar on Left pane and the content will load on the right pane... see below

__________________________________________________
I PanelBar I             Child1.aspx pages load in this area             I
I    Child 1  I                                                                                 I
I     Child 2 I                                                                                 I
I                 I                                                                                 I
I                 I                                                                                 I
__________________________________________________

I don't know much about RadSplitter yet, I was thinking if you have any RadSplitter code to get started?

Thanks again.
 AL
0
Accepted
Serrin
Top achievements
Rank 1
answered on 14 Jan 2009, 01:27 PM

Hey Al,

 

I knew I saw this in a demo somewhere, just couldn't find it until this morning... ;)

 

http://demos.telerik.com/aspnet-ajax/Splitter/Examples/ExternalContentLoading/DefaultCS.aspx

This gives you the basic layout of the splitter, all you have to do is swap a RadPanelBar into the left pane and have it set the ContentUrl of the right pane. Definitely a better option if you're dealing with that many pages!!

0
AL
Top achievements
Rank 1
answered on 14 Jan 2009, 03:42 PM
That is a good place to start. Thanks for the link.
Tags
PanelBar
Asked by
AL
Top achievements
Rank 1
Answers by
Serrin
Top achievements
Rank 1
AL
Top achievements
Rank 1
Share this question
or