ASP.NET Session 15


Published on

Published in: Technology
  • Be the first to comment

  • Be the first to like this

No Downloads
Total views
On SlideShare
From Embeds
Number of Embeds
Embeds 0
No embeds

No notes for slide

ASP.NET Session 15

  1. 1. Site Navigation Session - 15
  2. 2. Objective • Introduction • Features • Application of Site Navigation • Site map
  3. 3. Introduction • Any website that is composed of more than one web page needs some sort of navigation user interface. • The purpose of this type of navigation is to show the end users where they are presently in relation to the rest of the site. • ASP.NET tackles this problem by providing a navigation system that makes managing how end users work through the applications.
  4. 4. • For example, a website like is arranged into various web pages, like • Course Offer • Admission • Placement • Faculty • Syllabus of different courses • Campuses • Campus life and so on… • Each of these sections may have sub-sections. Like Course Offer have different page for individual courses like B.Tech, M.Tech, MBA, BBA, BCA, MCA etc. Typically, these logical structures form a hierarchy of sorts.
  5. 5. Diagram of Site Navigation Homepage Homepage Course OfferCourse Offer AdmissionAdmission PlacementPlacement FacultyFaculty CampusesCampuses B.TechB.Tech M.TechM.Tech MBAMBA MCAMCA
  6. 6. ASP.NET comes with a number of useful navigation controls that allow you to set up a navigation system. These controls include the, SiteMapPath, TreeView and Menu. • SiteMapPath: It shows the end user where he is relative to the site's structure. For example, when the user is visiting the Course Offer section on, a breadcrumb would display something like: Home > Course Offer > B.Tech.
  7. 7. • TreeView: A TreeView is capable of displaying a hierarchical list of items, similar to how the tree in Windows Explorer looks. Items can be expanded and collapsed with the small plus and minus icons in front of items that contain child elements. As such, it’s an ideal tool to display the site map of the web site as a means to navigate the site. • Menu: Which displays either a horizontally- or vertically-aligned menu. This control is ideal for allowing the end user to navigate a larger hierarchy of options.
  8. 8. SiteMapPath • Using the .sitemap file you just created with the SiteMapPath server control provided with ASP.NET is quite easy. You can find this control in the Navigation section of the Visual Studio IDE. • You should first create an application that has the Web.sitemap file. This file is defined in the Web.sitemap file as being on the lowest tier of files in the application. • The SiteMapPath control is so easy to work with that it doesn’t even require a data source control to hook it up to the Web.sitemap file where it infers all its information. All you do is drag and drop a SiteMapPath control onto your page. • Web.sitemap file contain
  9. 9. TreeView • The TreeView server control is a rich server control for rendering a hierarchy of data, so it is quite ideal for displaying what is contained in your .sitemap file. • <p> • <asp:TreeView ID="TreeView1" runat="server" DataSourceID="SiteMapDataSource1"> • </asp:TreeView> • <asp:SiteMapDataSource ID="SiteMapDataSource1" runat="server" /></p> • This TreeView control is very basic. The great thing about this control is that it allows for a high degree of customization and even gives you the capability to use some predefined styles that come prepackaged with ASP.NET 4.
  10. 10. Menu Server Control • One of the cooler navigation controls found in ASP.NET 4 is the Menu server control. This control is ideal for allowing the end user to navigate a larger hierarchy of options while utilizing very little browser real estate in the process. • From here, you can see that the first Menu control displayed simply shows the Home link with a small arrow to the right of the display. The arrow means that more options are available that relate to this upmost link in the hierarchy. The second Menu control displayed shows what the default control looks like when the end user works down one of the branches provided by the sitemap. • The Menu control is an ideal control to use when you have lots of options—whether these options are selections the end user can make or navigation points provided by the application in which they are working. The Menu control can provide a multitude of options and consumes little space in the process.
  11. 11. • Using the Menu control in your ASP.NET applications is rather simple. The Menu control works with a SiteMapDataSource control. You can drag and drop the SiteMapDataSource control and the Menu control onto the Visual Studio 2010 design surface and connect the two by using the Menu control’s DataSourceId property. Alternatively, you can create and connect them directly in code. <form id="form1" runat="server"> <div> <asp:SiteMapDataSource ID="aa" runat="server" /> <asp:Menu ID="Menu1" runat="server" DataSourceID="aa"> </asp:Menu></div> </form>
  12. 12. Summery • Site Navigation feature • Site map path