次の方法で共有

ASP.NET Web サーバー コントロール テンプレート

  • [アーティクル]

更新 : 2007 年 11 月

大半の Web サーバー コントロールには、既定の表示形式とレイアウトがあります。これは、プロパティを設定するか、またはスタイルを使用して操作できます。いくつかの Web サーバー コントロールでは、テンプレートを使用して表示形式をカスタマイズできます。

テンプレートは、コントロールの特定の部分のレイアウトを構成する HTML 要素とコントロールのセットです。たとえば、DataList Web サーバー コントロールでは、HTML 要素とコントロールの組み合わせを使用して、リストの各行のレイアウトを作成できます。同様に、GridView Web サーバー コントロールには、グリッド内の行のための既定の表示形式があります。ただし、個々の列に対して異なるテンプレートを定義することで、グリッドの表示形式をカスタマイズできます。

h59db326.alert_note(ja-jp,VS.90).gifメモ :

テンプレートは、スタイルとは異なります。テンプレートは、コントロールのセクションに関する内容 (DataList コントロールの行の内容など) を定義します。スタイルは、色、フォントなどの要素の表示形式を指定します。スタイルは、テンプレート項目に対して適用することも、コントロール全体 (GridView コントロールのフォント設定など) に対して適用することもできます。

テンプレートには、HTML および埋め込みサーバー コントロールが含まれます。ASP.NET Web ページでコントロールが実行されると、コントロール インフラストラクチャは、コントロールの既定の HTML の代わりにテンプレートの内容をレンダリングします。

テンプレートをサポートするコントロール

すべての Web サーバー コントロールがテンプレートをサポートしているわけではありません。ほとんどの場合、テンプレートは複雑なコントロールによってサポートされます。たとえば、GridView、DataList、Repeater、FormView、DetailsView、Login などのコントロールです。

各コントロールは、それぞれが少し異なるテンプレートのセットをサポートしています。各テンプレートは、ヘッダー、フッター、項目、選択された項目など、コントロールの異なる部分のレイアウトを指定します。カスタマイズの内容に応じて、これらのいずれか、またはすべてに対してテンプレートを指定できます。GridView コントロールでは、行ではなく列に対してテンプレートを指定できます。

テンプレートをサポートする Web サーバー コントロールの一覧を次の表に示します。

コントロール

テンプレート

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(ja-jp,VS.90).gifメモ :

Visual Studio 2005 などのビジュアルなデザイナを使用している場合、通常はビジュアル ツールを使用してテンプレートの作成や編集を行うことができます。詳細については、「方法 : デザイナを使用して Web サーバー コントロール テンプレートを作成する」を参照してください。

 
<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>

<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>

テンプレートの操作

template 宣言されたコントロールでは、要求があった場合にのみ、テンプレート コンテンツのインスタンスを作成します。つまり、テンプレート内のコントロールのインスタンスは、ページの読み込みイベントが発生した場合に作成されません。この動作は、テンプレート内のコントロールを使用する方法に影響を与えます。ページを読み込むときに、テンプレート内にコントロール インスタンスが作成済みであると仮定することはできません。

入れ子になったテンプレートは、入れ子になったマスタ ファイルと同様に、Visual Web Developer または Visual Studio 2005 のデザイン ビューにはレンダリングされません。

参照

概念

ASP.NET Web サーバー コントロールと CSS スタイル

その他の技術情報

ASP.NET でのデータ アクセス