36.C# ASP.NET - 웹 사용자 정의 컨트롤
똑같은 페이지 모양이 여러페이지에서 사용될 때 같은 웹사이트 내에서 사용할 수 있는
간단한 조그만 페이지를 만들어 놓음
기능 만들어 놓고 원하는 위치에 인클루드 하는 방법
코드를 재사용하는 게 아니라 페이지 모양을 재사용
실제 실행하는 템플릿은 Web Form가장 많이 쓰임
하나의 단위컨트롤 만들고 싶을 때 웹사이트 정의 컨트롤 사용
간단한 부분 페이지 확장자는 .ascx
예제에서 사용된 각각의 부분 페이지
Default.aspx : 메인
Navigator.ascx : 상위 메뉴
Category.ascx : 하부 메뉴
Catalog.ascx : 상품 진열
Copylight.ascx : 회사 소개
About.ascx : 기타 페이지
해당 프로젝트 - 새 항목 추가 - 웹 사용자 정의 컨트롤 추가
총 5개를 추가합니다.
( Navigator.ascx, Category.ascx, Catalog.ascx, Copylight.ascx, About.ascx )
[그림36-1]
| Navigator.ascx |
|
<div>
<a href="Default.aspx">HOME</a>
| <a href="About.aspx">About</a> </div> 
[그림36-2] |
| Category.ascx |
|
<div>
<h3>카테고리</h3>
<ul>
<li>C#</li>
<li>ASP.NET</li>
<li>Silverlight</li>
</ul>
<asp:Calendar ID="Calendar1" runat="server"></asp:Calendar> </div>
[그림36-3] |
| Catalog.ascx |
|
<div>
<h1>여기는 메인 페이지</h1> </div>
[그림36-4] |
| Copyright.ascx |
|
<div style="text-align:center;">
Copyright© ASP.NET All right
reserved. </div> [그림36-5] |
| Default.aspx |
|
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<%@ Register src="Navigator.ascx" tagname="Navigator" tagprefix="uc1" %> <!--추가--> <%@ Register src="Category.ascx" tagname="Category" tagprefix="uc2" %> <!--추가--> <%@ Register src="Catalog.ascx" tagname="Catalog" tagprefix="uc3" %> <!--추가--> <%@ Register src="Copyright.ascx" tagname="Copyright" tagprefix="uc4" %> <!--추가-->
<!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 id="Head1" runat="server">
<title></title> </head> <body>
<form id="form1" runat="server">
<div>
<table border="1" width="100%"> <tr> <td colspan="2"> <uc1:Navigator ID="Navigator1" runat="server" /> </td> </tr> <tr> <td style="width:180px;height:200px;"> <uc2:Category ID="Category1" runat="server" /> </td> <td> <uc3:Catalog ID="Catalog1" runat="server" /> </td> </tr> <tr> <td colspan="2"> <uc4:Copyright ID="Copyright1" runat="server" /> </td> </tr>
</table>
</div>
</form> </body> </html> |
| 결과화면 |
[그림36-6] |
36.WebUserControl.zip