CHƯƠNG IX: SITE NAVIGATION & USER CONTROL pptx

GiỚI THIỆU Site Navigation được sử dụng để  Di chuyển giữa các trang trong website  Quản lý tất cả các link  Hiển thị các link trong danh sách hoặc menu trên mỗi trang  Mô tả bố cục

GiỚI THIỆU

 Site Navigation được sử dụng để

 Di chuyển giữa các trang trong website

 Quản lý tất cả các link

 Hiển thị các link trong danh sách hoặc

menu trên mỗi trang

 Mô tả bố cục của web site như một hệ

thống thứ bậc

GiỚI THIỆU

VÍ DỤ:

Site Maps

 Bước đầu tiên khi làm việc với hệ thống

navigation trong ASP.NET 2.0 là xây

dựng một site map cho ứng dụng

 Một site map là một mô tả XML của cấu

trúc website

Site Maps

 Tạo site maps:

 Trong solution explorer, click phải trên

tên website chọn Add new Item, chọn site map

 Tập tin site map có phần mở rộng là

Web.sitemap

 Cấu trúc của tập tin site map như sau:

Site Maps

<?xml version="1.0" encoding="utf-8" ?>

<siteMap

xmlns="http://schemas.microsoft.com/AspNet/SiteMap-File-1.0" >

<siteMapNode url="" title="" description="">

<siteMapNode url="" title="" description="" />

<siteMapNode url="" title="" description="" />

</siteMapNode>

</siteMap>

Site Maps

 Trong một file sitemap chỉ có môt phần

tử <siteMap >

 Sử dụng tập tin site map:

<siteMapNode title="Home" description="Home" url=" Default.aspx “>

Ví d : ụ tạo tập tin web.sitemap

<siteMap>

<siteMapNode title=" Home " description="Home" url=“ home.aspx " />

<siteMapNode title="Hardware" description="Hardware we offer"

url=“ Hardware.aspx " />

< siteMapNode title="Software" description="Software for sale"

url=“ Software.aspx " />

</siteMapNode>

<siteMapNode title="Training" description="Training" url=“ Training.aspx " />

<siteMapNode title="Consulting" description="Consulting"

url=“Consulting.aspx" />

<siteMapNode title="Support" description="Support"

url=“ Support.aspx " /> </siteMapNode>

</siteMapNode>

</siteMap>

Ví dụ(tt)

 Site map được tạo có dạng:

 Lưu tập tin Web.sitemap

 Tạo các trang Navigate

T o Navigation Menu s d ng ạ ử ụ TreeView

Control

 Mở trang Home.aspx

 Trong nhóm Data chọn SiteMapDataSource thả

vào trang, ID= SiteMapDataSource1

 SiteMapDataSource control lấy thông tin cho nó

từ tập tin Web.sitemap

 Trong nhóm Navigation chọn TreeView thả vào

trang.

T o Navigation Menu s d ng ạ ử ụ TreeView Control

 Trong TreeView tasks, khung Choose

Data Source, chọn SiteMapDataSource1

T o Navigation Menu s d ng ạ ử ụ TreeView Control

 ShowCheckBoxes

 ShowLines

Hi n th Navigation History s d ng ể ị ử ụ

SiteMapPath Control

việc chuyển trang một cách tự động

 Có thể add Navigation cho mỗi trang để

hiển thị vị trí của trang trong cây thứ bậc hiện hành

Hi n th Navigation History s d ng ể ị ử ụ

SiteMapPath Control

hành trong cấu trúc thứ bậc

 Mặc định SiteMapPath hiển thị cấu trúc thứ

bậc được tạo trong tập tin Web.sitemap

Hi n th Navigation History s d ng ể ị ử ụ

SiteMapPath Control

 Thuộc tính:

 PathSeparatorTemplate: tạo ký hiệu

phân cách giữa các link

 Cú pháp:

<asp:SiteMapPath ID="SiteMapPath1" runat="server">

<PathSeparatorTemplate>|</PathSeparatorTemplate>

</asp:SiteMapPath>

 Trên Menu Tasks menu, trong hộp Choose

Data Source, click NewDataSource

T o Navigation Menu s d ng ạ ử ụ

Menu Control

T o Navigation Menu s d ng ạ ử ụ

Menu Control

 Trong cửa sổ Data Source Configuration

wizard, chọn Site Map

 Trong khung specify ID for the data

source: nhập tên datasource:

SiteMapDataSource1, click OK

K t h p ế ợ Site Navigation và Master

K t h p ế ợ Site Navigation và Master pages

 Tạo trang Master page

 Trong Solution Explorer, click phải trên tên

Web site, chọn Add New Item

 Chọn Master Page , Add

 Chuyển sang chế độ design, thiết kế trang

master page

 Đưa các Navigation control vào trang master

page

K t h p ế ợ Site Navigation và Master pages

siteMapPath

TreeView

K t h p ế ợ Site Navigation và Master pages

 Tạo các trang nội dung:

 Cách 1: nếu trang nội dung tạo sau trang

Master thì khi tạo, ta chọn trang master trong cửa sổ Add new Item

 Cách 2: nếu trang nội dung tạo trước trang

master thì thêm thuộc tính

<%@ Page Language="C#"

MasterPageFile="~/Navigation.master“ %>

ASP.NET User Controls

 user control is a kind of composite

control that works much like an ASP.NET Web page

 you can add existing Web server controls

and markup to a user control, and define properties and methods for the control You can then embed them in ASP.NET

Web pages, where they act as a unit

User Controls-Khai báo

 <%@ Register TagPrefix="My"

TagName="UserInfoBoxControl"

Src="~/UserInfoBoxControl.ascx" %>

To include a user control in a Web Forms page

<form runat="server"> <uc:Spinner id="Spinner1"

runat="server" MinValue="1" MaxValue="10" />

</form> </body>

Add a user control

Truy xuất dữ liệu của user

control

{ // These values can come from anywhere, but right now, we just hardcode them

MyUserInfoBoxControl.UserName = "Jane Doe";

MyUserInfoBoxControl.UserAge = 33;

MyUserInfoBoxControl.UserCountry = "Germany"; }

Loading dynamically

<asp:PlaceHolder runat="server" ID="phUserInfoBox" />

 In the CodeBehind of the page, we add the

control like this;

phUserInfoBox.Controls.Add(LoadControl("~/UserInfoBoxC

ontrol.ascx"));

UserControl by specifying the path On the page, add the following declaration in the top:

<%@ Reference Control="~/UserInfoBoxControl.ascx" %>

userInfoBoxControl.UserName = "John Doe";

userInfoBoxControl.UserAge = 78;

userInfoBoxControl.UserCountry = "Spain";

phUserInfoBox.Controls.Add(userInfoBoxControl);