Nested Page Navigation

18 posts, 1 answers
  1. Jeff
    Jeff avatar
    22 posts
    Member since:
    Nov 2008

    Posted 02 Jan 2009 Link to this post

    Hi Guys,

    I have implemented the navigation framework and all works well for my first level navigation.  When I attempt to navigate to a nested page, nothing is happening.

    In the top level page, I have defined another container and frame for the nested content.

     

     

    <telerik:RadFrameContainer Grid.Row="1" Grid.Column="0" x:Name="SchedulingContainer">

     

     

     

    <telerik:RadFrame x:Name="scheduleFrame" />

     

     

     

    </telerik:RadFrameContainer>

     


    From a button click event, I'm attempting to set the nested content as follows:

     

    Private Sub PatientViewButton_Click() Handles PatientViewButton.Click

     

       

     

     

        Dim service As NavigationService = NavigationService.GetNavigationService()

     

        service.Target =

    CType(App.theAdminPage, AdminPage).SchedulingContainer

     

     

        If IsNothing(App.theScheduleCalenderPage) Then

     

            service.Navigate(

    New ScheduleCalenderPage)

     

     

        Else

     

            service.Navigate(App.theScheduleCalenderPage)

     

        End If

     

     

        Me.UpdateLayout()

     

     


    End
    Sub

    The nested content page is defined as a RadPage.  The only difference between what is working for the first level navigation and the nested navigation is the target property.   Via the debugger, I verified the value of service.target is being set properly.  Can you tell me what I'm doing wrong?

    Thanks very much for your help.  BTW, I'm growing rather fond of your software (:
    Jeff

     

  2. Ben Hayat
    Ben Hayat avatar
    892 posts
    Member since:
    May 2008

    Posted 04 Jan 2009 Link to this post

    Jeff, check your App.CS/vb to make sure you create a ContainerFrame first and assign your main page as RADPage to it. Take a look at the samples how to do that.

    I think that might be your issue!
    ..Ben
  3. DevCraft banner
  4. Bobi
    Admin
    Bobi avatar
    513 posts

    Posted 05 Jan 2009 Link to this post

    Hello ..Ben,

    If you use RadFrame in RadFrameContainer then there will be no need to call the NavigationService.Navigate. You can use RadFrame`s Navigate method:

    scheduleFrame.Navigate(new Page1());

    Please also check the App.xaml.cs/vb file to make sure that the RootVsual is set to RadframeContainer. If you use RootPanel make sure it is correctly set.

    All the best,
    Boryana
    the Telerik team

    Check out Telerik Trainer, the state of the art learning tool for Telerik products.
  5. Ben Hayat
    Ben Hayat avatar
    892 posts
    Member since:
    May 2008

    Posted 05 Jan 2009 Link to this post

    Boryana, nice to see the team is back and I hope you had great time.

    In your last post, did you mean "Hello Ben" or Hello Jeff"? ;-)
  6. Jeff
    Jeff avatar
    22 posts
    Member since:
    Nov 2008

    Posted 05 Jan 2009 Link to this post

    Hello Boryana,

    Still having a problem with nested navigation.

    Here is my code in app.xaml.vb

     

    Me.RootVisual = New RadFrameContainer()
    Dim service As NavigationService = NavigationService.GetNavigationService()

     

    service.Target =

    CType(Me.RootVisual, RadFrameContainer)
    service.Transition =
    New FadeTransition()
    service.Navigate(
    New MainPage())

    As I mentioned, the first level page navigation works fine using the NavigationService.

    This is the xaml in the page where I want to employ nested navigation:

     

     

     

    <telerik:RadFrameContainer Grid.Row="1" Grid.Column="0" x:Name="PatientRescheduleContainer">

     

     

     

     

     

     

            <telerik:RadFrame x:Name="PatientRescheduleFrame"/>

     

     

     

     

     

     

    </telerik:RadFrameContainer>

    This is the code behind file where I set the nested content navigation:

     

    Public

     

    Sub ListViewButton_Click() Handles ListViewButton.Click

     

     

     

        Dim myAdminPage As AdminPage = App.theAdminPage
        If IsNothing(App.thePatientRescheduleListPage) Then

     

     

     

     

     

            Dim theNewPage As PatientRescheduleListPage = New PatientRescheduleListPage
            App.thePatientRescheduleListPage = theNewPage
            myAdminPage.PatientRescheduleFrame.Navigate(theNewPage)

     

     

        Else
            m
    yAdminPage.PatientRescheduleFrame.Navigate(App.thePatientRescheduleListPage)

     

     

        End If

        myAdminPage.UpdateLayout()

     

     

     

    End Sub

    As far as I can tell, this code is correct.  The nested navigation is very important to my application.  If you could create a simple demo and send to me it would be greatly appreciated.

    Thank you in advance for your assistance.

    Jeff

     

  7. Bobi
    Admin
    Bobi avatar
    513 posts

    Posted 06 Jan 2009 Link to this post

    Hello Jeff,

    If you just use one RadPage with property for example and want to change this property when selecting new item from the listbox you must use some browser navigation identifier. You have two choices:

     Either to use

     NavigationService.UseHistoryBookmark = true; (if you prefer to use simple navigation without WebApplication and BrowserHistory)

     or

    NavigationService.UseBrowserHistory = true;(if you use Webapplication and browser history).

    If you do not use different browser identifier for each page instance then the NavigationFramework will navigate for the same page each time because of the same NavigationIdentifier propertys value.(Note: Each RadPage have its own NavigationIdentifier that’s why  if you want to navigate to this page multiple times with different content you have to change this property!)

    So if you want to use nested page navigation with different instances of one page you have to do the following in the page that you want to navigate:

    public string PageID

                {

                      get

                      {

                            return this.pageID;

                      }

                      set

                      {

                            this.pageID = value;

                            NavigationIdentifier = "AdminPage" + this.pageID ;

                      }

                }

     

    Note: It is important to set NavigationIdentifier to some custom value in order to have navigation to one page multiple times with different content!

    The next step is to enable Back and Forward functionality as well as DeepLinking support for your custim page instances if you prefer to have this functionality. To do that you have to call 3 eventa in the App.xaml.cs Application_Startup method:

    service.GetPageFromBookmark += new EventHandler<FrameInfoEventArgs>(this.Service_GetPageFromBookmark);

                      service.GetBookmarkFromUri += new EventHandler<UriInfoEventArgs>(this.Service_GetBookmarkFromUri);

                      service.GetUriFromBookmark += new EventHandler<UriInfoEventArgs>(this.Service_GetUriFromBookmark);

     

    After thet add the next methods to App.xaml.cs:

    private void Service_GetUriFromBookmark(object sender, UriInfoEventArgs e)

                {

                      string bookmark = e.Bookmark;

                }

     

                private void Service_GetBookmarkFromUri(object sender, UriInfoEventArgs e)

                {

                      string uri = e.Uri;

                }

     

    private void Service_GetPageFromBookmark(object sender, FrameInfoEventArgs e)

                {

                      if (e.FrameType.Contains("AdminPage"))

                      {

                            AdminPage page = new AdminPage();

                            string frameType = e.FrameType.Substring(0, e.FrameType.Length );

                            page.PageID = frameType.Substring(frameType.LastIndexOf("_") + 1);

                            e.Frame = page;

                      }

                }

     

    Please find attached sample project. I hope this answers your question.



    Sincerely yours,
    Boryana
    the Telerik team

    Check out Telerik Trainer, the state of the art learning tool for Telerik products.
  8. Jeff
    Jeff avatar
    22 posts
    Member since:
    Nov 2008

    Posted 07 Jan 2009 Link to this post

    Hello Boryana,

    First off, let me thank you for the example.  Your support is fantastic and I'm looking forward to using your products in our project.

    While the example was insightful, I'm not sure that it will allow us to implement the UI we desire.  Please take a look at the UI we are trying to implement.  You can see at www.xapworks.com

    The page you are looking at is the AdminPage.  It was loaded from the MainPage using your navigation service.  Within each of the panels, we wish to display several views of the data contained within a specific panel.  For example, we may wish to view the schedule data as a list, calender or graph.  The views are navigated to via the buttons contained at the top of each panel.  Of course we could use a tab control for this, but we want to take advantage of animation to switch between the views.

    Within the AdminPage, we define a RadContainer/RadFrame as the content for each of the panels.  When one of the panel buttons is clicked, we want to change the content of the panel based on the button type.

    By using a different technique, I was able to get this functionality (exercise the provider schedule panel), but it is not optimal because all of the views for the panel are contained within a single page.

    I would really like to have a separate page for each panel view and use frame.navigate to switch between them.

    If I understand your example, it seems like we would have to have a unique page ID for each of the possible states of the page which would be unworkable.

    I hope this description is more clear to what we would like to acheive with your naviation product.  BTW, check out the panel drag drop capability.

    Thank you so much.

    Jeff

  9. Bobi
    Admin
    Bobi avatar
    513 posts

    Posted 07 Jan 2009 Link to this post

    Hi Jeff,

    Thank you for the good words.

    Each panel have to use its own RadPage. The navigation in the panel can be dynamic similar to the one shown in the example I sent to you. For example, let's take the "Patients" panel and add ParentPage as a master page for this panel and OptionPage as a content page. In this page you have to implement your custom logic so that you will have navigation to one page with different content.
    For each option (in your case "ListViewOption" and "ReportViewOption") you have to use unique ID.

    Example:
    If "ListViewOption" ID = "1" and  "ReportViewOption" ID = "2"  then
                    NavigationIdentifier="Option" + ID;
                   
    Afterward, you can bind your Panel to some value that is corresponding to the ID.
    For more information about Binding and NestedPageNavigation take a look at the BooksExample(in your application Books class is corresponding to ParentPage  and BooksDescription to ContentPage).

    I hope this answers your question.

    Regards,
    Boryana
    the Telerik team

    Check out Telerik Trainer, the state of the art learning tool for Telerik products.
  10. Jeff
    Jeff avatar
    22 posts
    Member since:
    Nov 2008

    Posted 10 Jan 2009 Link to this post

    I was able to get nested page navigation working by defining a unique ID.  Good so far.

     

    I then attempted to add an additional RadContainer/RadFrame to the parent page and can't get that to work.  My requirement is to have multiple containers on the same page, each having nested content.  I have reviewed your demo apps and documentation to no avail.  It would be greatly appreciated if you could modify your sample to illustrate this technique. 

    My preference is to use simple navigation without browser history.

    Thank you very much.
    Jeff

  11. Answer
    Miroslav
    Admin
    Miroslav avatar
    922 posts

    Posted 14 Jan 2009 Link to this post

    Hi Jeff,

    Unfortunately there can only be one FrameContainer in any RadPage. The relation between them is Parent -> Child, Child -> Parent.

    It will not be possible to add a FrameContainer in each panel (as I gather you were planning to do).

    I am sorry for this limitation, hopefully it will not disrupt your work.

    Sincerely yours,
    Miroslav
    the Telerik team

    Check out Telerik Trainer, the state of the art learning tool for Telerik products.
  12. Jack
    Jack avatar
    45 posts
    Member since:
    Feb 2009

    Posted 13 Feb 2009 Link to this post

    Jeff,

    Sorry to be so nosy on your thread but I happened to go to you XapWorks page and I was curious what you are using to do the docking / drag drop?

    Thanks

    jack
  13. Jeff
    Jeff avatar
    22 posts
    Member since:
    Nov 2008

    Posted 13 Feb 2009 Link to this post

    Hey Jack,

     

    I use the Blacklight panels from Martin Grayson.  This is part of what Microsoft has developed for their healthcare demo. Go to Codeplex and search on the keyword Blacklight.  I think it's really nice for portal type pages.  It's a good start, but there is some additional functionality that needs to be developed around the panel functionality.  If you end up using this, I'll be happy to collaborate with you.

    Jeff

     

     

  14. Ben Hayat
    Ben Hayat avatar
    892 posts
    Member since:
    May 2008

    Posted 13 Feb 2009 Link to this post

    Thanks Jeff and Jack for bringing this up. I looked at it several months ago, but kind of lost track of it. Now I see it has grown substantially. Time to revisit again.

    Thanks guys!
  15. Jack
    Jack avatar
    45 posts
    Member since:
    Feb 2009

    Posted 13 Feb 2009 Link to this post

    I knew I had seen it somewhere... I've been watching the Health UI for quite a while and had seen the Blacklight controls as well.

    Maybe another tool for the Telerik arsenal?  It would be nice to merge that with the Docking features

    Thanks
    jack
  16. Ben Hayat
    Ben Hayat avatar
    892 posts
    Member since:
    May 2008

    Posted 13 Feb 2009 Link to this post

    I think as a short term solution for Telerik, would be to support this kit with their Theme. This way we can use the kit along side Telerik controls for time being and they all will have the same theme.
    I hope team gets to read these posts!

    Jeff, how solid is this product? I'm mostly interested in the panel section?

  17. Jeff
    Jeff avatar
    22 posts
    Member since:
    Nov 2008

    Posted 13 Feb 2009 Link to this post

    Hi Ben,

    From my experience so far, the panel functionality works well.  As I mentioned, I think additional functionality needs to be developed to make this more usable.  For example, right now all panels need to be the same size which I find lacking for both functional and aesthetic reasons.  The ability to save and restore the panel page state does not exist.  Databinding does not exist.  I envisioned the capility to define a bunch of these to encapsulate various functionality and have the user be able to select which content they want to have displayed on the page, along with the ability to load in new panels.  These a few of the things I have been thinking about regarding this control.  Martin does provide the source so these functions could be implemented.

    Martin mentioned that he has another control in the works which should be out any time soon, and has hinted that some of these capabilities might appear in his new control.

    Jeff

  18. Ben Hayat
    Ben Hayat avatar
    892 posts
    Member since:
    May 2008

    Posted 13 Feb 2009 Link to this post

    Thanks Jeff, So as far as the data binding goes, the panel does not implement the ItemsSource to be connected to a data source? Which means you have to embed and container in there to attach datasource to the container.

    I think I'll wait a bit to get the final version of RADDockPanel, but I do like the way to panel open up and closes to the side!
  19. Rajnikant Rajwadi
    Rajnikant Rajwadi avatar
    15 posts
    Member since:
    Sep 2009

    Posted 23 Nov 2009 Link to this post

    Hi Jeff,

    I create a dragdockpanel for loading a page or user control into it.

    So for that I create dragdockpanel in mainpage and loading another cotnrols into it. 

    So Now I have to implement bookmarking into my program, So there is a navigation framework for it.

    But the problem is that When I use blacklight, I didnt use navigation into it, instead i load my different pages into dragdockpanel .

    Now I want to change the logic by applying navigation from blacklight.

    So is there any way to do it ?

    Thanks,

    Rajnikant 

Back to Top
DevCraft banner