ASP.NET 웹 서버 컨트롤 템플릿

Visual Studio 2010

업데이트: 2007년 11월

모든 웹 서버 컨트롤에는 속성을 설정하거나 스타일을 사용하여 조작할 수 있는 기본 모양과 레이아웃이 있습니다. 일부 웹 서버 컨트롤은 템플릿을 통해 모양을 사용자 지정할 수 있습니다.

템플릿이란 컨트롤의 특정 부분에 대한 레이아웃을 구성하는 HTML 요소 및 컨트롤 집합입니다. 예를 들면, DataList 웹 서버 컨트롤에서 HTML 요소와 컨트롤 조합을 사용하여 목록의 각 행에 대한 레이아웃을 만들 수 있습니다. 마찬가지로 GridView 웹 서버 컨트롤에는 모눈의 행에 대한 기본 모양이 있습니다. 그러나 개별 열에 대해 서로 다른 템플릿을 정의하여 모눈의 모양을 사용자 지정할 수 있습니다.

h59db326.alert_note(ko-kr,VS.100).gif참고:

템플릿과 스타일은 다릅니다. 템플릿은 컨트롤 섹션의 내용(예: DataList 컨트롤의 행 내용)을 정의합니다. 스타일은 색, 글꼴 등과 같은 요소의 모양을 지정합니다. 스타일은 템플릿 항목에도 적용되고 GridView 컨트롤의 글꼴을 설정할 경우와 같이 컨트롤 전체에 적용될 수도 있습니다.

템플릿은 HTML과 포함된 서버 컨트롤로 구성됩니다. 컨트롤이 ASP.NET 웹 페이지에서 실행되면 컨트롤 인프라가 컨트롤의 기본 HTML 대신 템플릿의 내용을 렌더링합니다.

모든 웹 서버 컨트롤이 템플릿을 지원하는 것은 아닙니다. 대부분의 경우 템플릿은 복합 컨트롤에 의해 지원됩니다. 이러한 컨트롤로는 GridView, DataList, Repeater, FormView, DetailsView, Login 등이 있습니다.

각 컨트롤은 머리글, 바닥글, 항목 및 선택한 항목 등 컨트롤의 서로 다른 부분의 레이아웃을 지정하는 다양한 템플릿 집합을 지원합니다. 사용자가 지정하기에 따라 일부 또는 전체 부분에 대해 템플릿을 지정할 수 있습니다. GridView 컨트롤에서는 행이 아닌 열에 대해 템플릿을 지정할 수 있습니다.

다음은 템플릿을 지원하는 웹 서버 컨트롤에 대한 요약입니다.

컨트롤

템플릿

ChangePassword

  • ChangePasswordTemplate

  • SuccessTemplate

CompleteWizardStep

  • ContentTemplate

  • CustomNavigationTemplate

CreateUserWizard

  • HeaderTemplate

  • SideBarTemplate

  • StartNavigationTemplate

  • StepNavigation

  • FinishNavigation

CreateUserWizardStep

  • ContentTemplate

  • CustomNavigationTemplate

DataList

  • HeaderTemplate

  • FooterTemplate

  • ItemTemplate

  • AlternatingItemTemplate

  • SeparatorTemplate

  • SelectedItemTemplate

  • EditItemTemplate

DetailsView

  • HeaderTemplate

  • FooterTemplate

  • PagerTemplate

  • EmptyDataTemplate

FormView

  • ItemTemplate

  • EditItemTemplate

  • InsertItemTemplate

  • HeaderTemplate

  • FooterTemplate

  • PagerTemplate

  • EmptyDataTemplate

GridView

  • PagerTemplate

  • EmptyDataTemplate

ListView

  • LayoutTemplate

  • ItemTemplate

  • ItemSeparatorTemplate

  • GroupTemplate

  • GroupSeparatorTemplate

  • EmptyItemTemplate

  • EmptyDataTemplate

  • SelectedItemTemplate

  • AlternatingItemTemplate

  • EditItemTemplate

  • InsertItemTemplate

Login

  • LayoutTemplate

LoginView

  • AnonymousTemplate

  • LoggedInTemplate

Menu

  • DynamicTemplate

  • StaticTemplate

PasswordRecovery

  • QuestionTemplate

  • SuccessTemplate

  • UserNameTemplate

Repeater

  • HeaderTemplate

  • FooterTemplate

  • ItemTemplate

  • AlternatingItemTemplate

  • SeparatorTemplate

SiteMapPath

  • CurrentNodeTemplate

  • RootNodeTemplate

  • NodeTemplate

  • PathSeparatorTemplate

TemplatePagerField

  • PageTemplate

UpdatePanel

  • ContentTemplate

UpdateProgress

  • ProgressTemplate

Wizard

  • FinishNavigationTemplate

  • HeaderTemplate

  • StartNavigationTemplate

  • StepNavigationTemplate

  • SideBarTemplate

.aspx 파일에서 직접 템플릿을 만들 수 있습니다. 템플릿은 XML 선언으로 만들어집니다. 다음 예제에서는 DataList 컨트롤의 템플릿을 사용하여 직원 이름, 전화 번호 및 전자 메일 주소 목록을 표시할 수 있는 방법을 보여 줍니다. 직원 정보의 레이아웃은 데이터 바인딩된 컨트롤을 사용하여 ItemTemplate에 지정합니다.

h59db326.alert_note(ko-kr,VS.100).gif참고:

Visual Studio 2005와 같은 비주얼 디자이너를 사용하는 경우 일반적으로 비주얼 도구를 사용하여 템플릿을 만들고 편집할 수 있습니다. 자세한 내용은 방법: 디자이너를 사용하여 웹 서버 컨트롤 템플릿 만들기를 참조하십시오.

<asp:datalist id="DataList1" runat="server">
  <HeaderTemplate>
  Employee List
  </HeaderTemplate>
  <ItemTemplate>
    <asp:label id="Label1" runat="server" 
        Text='<%# DataBinder.Eval(Container, "DataItem.EmployeeName")%>'></asp:label>
    <asp:label id="Label2" runat="server" 
        Text='<%# DataBinder.Eval(Container, "DataItem.PhoneNumber")%>'></asp:label>
    <asp:Hyperlink id="Hyperlink1" runat="server" 
        Text='<%# DataBinder.Eval(Container, "DataItem.Email") %>'
        NavigateURL='<%# DataBinder.Eval(Container, "DataItem.Link") %>'>
    </asp:Hyperlink>
  </ItemTemplate>
</asp:datalist>


템플릿 컨트롤에서는 요청 시에만 해당 템플릿 콘텐츠의 인스턴스를 만듭니다. 즉, 페이지 로드 이벤트가 발생할 때 템플릿의 컨트롤 인스턴스가 만들어지지 않을 수도 있습니다. 이 동작은 템플릿 내의 컨트롤을 사용하는 방식에 영향을 줄 수 있습니다. 페이지를 로드하더라도 템플릿 내의 컨트롤 인스턴스가 만들어지리라는 보장이 없습니다.

Visual Studio 2005나 Visual Web Developer의 디자인 뷰에서는 중첩된 템플릿과 중첩된 마스터 파일이 렌더링되지 않습니다. 그러나 웹 브라우저에서는 중첩된 항목이 올바르게 렌더링됩니다.

표시: