ASP+ リスト連結コントロールの使用

概要: ASP+ Repeater コントロール、DataList コントロール、および DataGrid サーバーコントロールについて説明します。これらのコントロールは、データソースにある HTML 形式のアプリケーションユーザーインターフェイスを表示する機能を提供します。ここでは、これらのコントロールに関する概念について説明してから、これらのコントロールを使用した基本的なサンプルを見ていきます。この文書は、印刷すると約 25 ページになります。

はじめに

Repeater コントロール、DataList コントロール、および DataGrid コントロールは ASP+ Page Frameworkの System.Web.UI.WebControls 名前空間内で相互に関係する Web コントロールのセットを構成します。これらのコントロールは、コントロールがバインドされているリストまたはデータソースの内容を表示するために HTML を生成します。そのため、これらのコントロールをまとめて "リスト連結コントロール" と呼びます。

フレームワークのほかの Web コントロールと同様に、これらのコントロールは一貫性のあるプログラミングモデルとブラウザに依存しないカプセル化された表示ロジックを提供します。これらの機能を使用することにより、開発者は一貫性のない、複雑な HTML に精通しないでもオブジェクトモデルに対してプログラムを作成できます。

この 3 つのコントロールを使用することにより、表形式、新聞、雑誌などの縦割りデータ、およびフローレイアウト (HTML フロー) などのさまざまなレイアウトで、関連するデータソースの内容を表示できます。さらに、これらのコントロールを使用すると、まったく表示されないレイアウト、または完全に独自のレイアウトを作成できます。これらのコントロールは、ロジックを表示する以外にも、通知されたデータを処理する機能、状態管理を実行する機能、イベントを発生させる機能をカプセル化します。これらのコントロールは、選択、編集、ページ処理、並べ替えなど、さまざまなレベルの標準操作をサポートします。これらのコントロールを使用して、レポート、ショッピングカート、商品リスト、クエリ結果、およびメニュー操作など、Web アプリケーションのシナリオで生じるいくつかの一般的な作業を単純化することができます。

以下のセクションでは、これらのコントロールについて、ユーザー独自の Web アプリケーションでコントロールを使い始める方法、およびどのコントロールを使用するかを選択する方法について詳しく説明していきます。

リスト連結コントロールはどのように機能するか ?

このセクションでは、この記事の後半部分に対する背景情報を提供します。リスト連結コントロールの仕組み、共通機能、および関連概念の概要を提供します。

DataSource プロパティ

各コントロールには System.Collections.ICollection 型の DataSource プロパティがあります。つまり、データソースは同種オブジェクトのリストまたはコレクションになります。

フレームワークには ICollection のインプリメンテーションを提供するオブジェクトがいくつか存在します。このセットには、配列をはじめとし、リレーショナルデータベースおよび XML データにアクセスするために使用する System.Data.DataView、および ArrayList や Hashtable などの汎用の ICollection インプリメンテーションがあります。

通常 ADO レコードセットを必要とする従来のデータ連結コントロールとは異なり、これらのリスト連結コントロールは ICollection インターフェイスをインプリメントする以外には、データソースで必要なものはありません。これらのリスト連結コントロールは、DataSource プロパティの有効な値としての条件を満たす型の種類やデータ構造を増やすことにより、アプリケーションコード内での容易性と柔軟性を最大限に引き出すように設計されています。

Items コレクション

各リスト連結コントロールには Items コレクションがあります。データソースを表すオブジェクトを列挙することにより、コントロールはアイテムのコレクションを設定します。列挙したオブジェクトごとに、アイテムが 1 つ作成されます。アイテムは、そのオブジェクトを表示するために使用されます。これらのアイテムもまたリスト連結コントロールに含まれるコントロール階層構造の一部になります。

以下の表は、データソースからのデータに関連付けられたアイテムの種類の一覧です。

Item	特に指定しないときに作成されるアイテムです。
AlternatingItem	Items コレクション内で奇数インデックスを持つアイテムに対して作成されます。
SelectedItem	選択されたアイテムに対して作成されます。(代替アイテムであるかどうかとは無関係です)
EditItem	編集モードのアイテムに対して作成されます。(選択されたアイテムまたは代替アイテムであるかどうかとは無関係です)

表示に使用するために、コントロールは以下のアイテムも作成します。ただし、これらはデータソースからのデータには関連付けられません。

Header	ヘッダー情報を表示するために使用します。
Footer	フッター情報を表示するために使用します。
Separator	図 1 で示すように、各アイテム間に内容を表示するために使用します。Repeater および DataList にのみ適用されます。
Pager	DataGrid コントロールに関連付けられたページ処理 UI を表示するために使用します。

図 1. Controls コレクションに関係する Items コレクション

データ連結と Items の作成

リスト連結コントロールは、ASP+ フレームワークに実装されている明示的なデータ連結モデルに従います。つまり、コントロールの DataBind メソッドが呼び出されたときのみ、コントロールはデータソースを必要とし、列挙します。

DataBind メソッドを呼び出すと、リストコントロールはデータソースを列挙し、アイテムを作成し、データソースから値を抽出することによりアイテムを初期化します。状態管理が有効になっている場合は、コントロールはページのポストバック処理中に、データソースを再設定することなく、アイテムを再作成するために、必要な情報をすべて保存します。

明示的なデータ連結モデルを使用すると、アプリケーションコードは処理手順のいつ、どこでデータソースが必要になるかを正確に決定できます。この機能を使用することで、少ない回数で、より効率的にデータベースサーバーにアクセスできます。これらは Web アプリケーションでは、通常もっとも困難な操作です。

一般的な規則として、アイテムを再作成するときは DataBind を呼び出す必要があります。多くの場合、ページが初期アイテムコレクションを作成するように最初に要求されたときに、DataBind を呼び出します。それ以降に行われるページの動作では、アイテムコレクションを変更する原因となるさまざまなイベントハンドラでこのメソッドを呼び出す必要があります。元のデータソースを作成するために使用されたクエリを変更するときも、このメソッドを呼び出す必要があります。また、読み取り専用モードから編集モードに変更するなど、アイテムの状態が変化したときにもこのメソッドを呼び出す必要があります。

スタイル

オブジェクトモデルのスタイルプロパティを使用することにより、DataList コントロールおよび DataGrid コントロール全体とこれらのコントロールに含まれるアイテムの形式と表示上の外観を定義できます。これらのプロパティを使用して、フォント、色、境界線、およびその他の外観要素をカスタマイズできます。コントロール自身のスタイルプロパティは、ForeColor、BackColor、および Font と BorderStyle などのコントロール全体の表示に影響します。

そのほかにも、各コントロールには、コントロールが作成するアイテムの種類に対応する ItemStyle、AlternatingItemStyle、および HeaderStyle などの多くのスタイルプロパティがあります。DataGrid コントロールは、特定の列のすべてのセルに影響する 3 番目のレベルのスタイルプロパティを提供します。コントロールに含まれる各列は、独自の HeaderStyle、FooterStyle、および ItemStyle を持つことができます。

テンプレート

スタイルコントロールは、表示形式を制御しますが、テンプレートは各アイテムの内容と表示を定義します。テンプレートは、アイテムを表示するために使用するコントロール階層を定義する HTML の一部であると考えられます。

Repeater コントロールと DataList コントロールは指定されたテンプレートによって駆動され、ItemTemplate、AlternatingItemTemplate、および HeaderTemplate などの設定可能なさまざまなテンプレートプロパティを提供します。スタイルと同様に、各テンプレートは特定の種類のアイテムに対応しています。

DataGrid コントロールはテンプレートを使用しません。ただし、コントロールの Column コレクション内の TemplateColumns によって、DataGrid でのテンプレートの使用が可能になります。Repeater コントロールまたは DataList コントロールのアイテムと同様に、TemplateColumn 内の各セルがテンプレートを持つことができます。この結果、DataGrid 内でも独自の表示が可能になります。

テンプレート内のデータ連結

テンプレートは、アイテムに含まれるコントロール階層を定義します。この階層内のコントロールのプロパティは、データ連結式を使用して、そのアイテムに関連付けられたデータのプロパティに連結できます。

テンプレートの論理的な親であるアイテムは、データ連結式で "コンテナ" と呼ばれます。各コンテナには、関連付けられたデータを参照する DataItem と呼ばれるプロパティがあります。その結果、テンプレート内の多くの一般的なデータ連結式は、コントロールのプロパティを Container.DataItem にあるプロパティに連結します。このデータ連結は、以下のセクションにあるサンプルで詳しく説明しています。

Repeater コントロール

前述のようにリピータコントロールは、完全なテンプレート駆動で、全体的にカスタマイズ可能な表示とレイアウトを作成できます。この機能は以下の図で示しています。

図 2. Repeater コントロールを使用して作成されたリンクの箇条書きリスト

Repeater1.aspx:

<%@ Page language="C#" src="template>
  <template
      name="ItemTemplate">
   
      <li>
      <asp:HyperLink
      runat=server
        Text='<%#
      DataBinder.Eval(Container.DataItem, "SiteName")
      %>'
        NavigateUrl='<%#
      DataBinder.Eval(Container.DataItem, "SiteURL")
      %>'>
      </asp:HyperLink>
   
      </li>
  </template>
  <template
      name="FooterTemplate">
   
      </ul>
  </template>
</asp:Repeater>

上記の .aspx ファイルは箇条書きリストを作成するために使用した Repeater コントロールの宣言を示しています。

このサンプルは、データ連結構文 (<%# ・・・ %>) を使用してデータソースを設定する宣言方法を示しています。データ連結内の式は DataBind メソッド呼び出し時に実行されます。この場合 Repeater の DataSource プロパティは、表示される URL 参照を持つページの SiteLinks プロパティに連結されます。

Repeater は、テンプレート内で HTML フラグメントを有効にする唯一のコントロールです。また、これらを一緒にすると完全な形式の HTML になります。上記のサンプルで箇条書きリストは 3 部分に分かれています。

HeaderTemplate が表すリスト開始タグ (<ul type="1">)。
FooterTemplate が表すリスト終了タグ (</ul>)。
リストの本体は、SiteLinks コレクション内に存在するオブジェクトごとに、ItemTemplate を繰り返すことにより生成されるリストアイテムによって設定されます。

これらのテンプレートを使用して、ヘッダーで表開始タグ (<TABLE>) を、フッターで表終了タグ (</TABLE>) を、および各アイテムで表の行 (<TR>) を指定できます。この代替は、表形式で表示することになります。

ItemTemplate を指定する必要があります。これは唯一必要なテンプレートです。コントロールは、テンプレートが指定されていないとき、ほかのテンプレートの ItemTemplate を自動的に使用します。

次のサンプルでは、ItemTemplate は HyperLink Web コントロールを含んでいます。このコントロールの Text プロパティおよび NavigateUrl プロパティは、繰り返されている各アイテムに関連付けられたデータのプロパティに連結されます。これはアイテムが作成された後は、評価されるデータ連結式を使用して実行されます。

Repeater1.cs:

namespace Samples {
   
      ...

    public class Repeater1Page : Page
      {
        protected Repeater
      linksListRepeater;
        
        public
      ICollection SiteLinks
      {
            get
      {
               
      ArrayList sites = new
      ArrayList();

               
      sites.Add(new SiteInfo("Microsoft
      Home",
                                       "http://www.microsoft.com"));
               
      sites.Add(new SiteInfo("MSDN
      Home",
                                       "http://msdn.microsoft.com"));
               
      sites.Add(new SiteInfo("MSN
      Homepage",
                                       "http://www.msn.com"));
               
      sites.Add(new
      SiteInfo("Hotmail",
                                       "http://www.hotmail.com"));
               
      return
      sites;
            }
        }

        protected
      override void OnLoad(EventArgs e)
      {
            base.OnLoad(e);

            if
      (!IsPostBack)
      {
               
      // ページが始めて要求されるときに DataBind を呼び出します。
               
      // これはページのコントロール階層内の
               
      // 各コントロールを再帰的に呼び出します。
               
      DataBind();
            }
        }
   
      }

    public sealed class SiteInfo
      {
        private string
      siteName;
        private
      string
      siteURL;

        public
      SiteInfo(string siteName, string siteURL)
      {
            this.siteName
      =
      siteName;
            this.siteURL
      =
      siteURL;
        }

        public
      string SiteName
      {
            get
      { return siteName;
      }
        }
        public
      string SiteURL
      {
            get
      { return siteURL;
      }
        }
   
      }
}

上記の .cs ファイルは、前述の aspx ページに沿ったコードを含んでいます。

Repeater1Page クラスは Page クラスの OnLoad メソッドをオーバーライドします。このインプリメンテーションは、ページが初めて要求されるときに DataBind を呼び出します。そのページのデータ連結式が評価され、Repeater コントロールがデータソースを列挙し、アイテムを作成します。DataBind メソッドは、最初の要求時のみ呼び出されます。これは、Repeater がデータソースのインスタンスを要求しないで、以前に保存した状態からポストバック中に、アイテムを再作成できるので可能になります。

ページは ICollection 型のパブリックプロパティ SiteLinks を公開します。これは、Repeater の DataSource プロパティの値を設定するデータ連結式で使用されます。プロパティの get のインプリメンテーションは、一連の SiteInfo オブジェクトを含む ArrayList を使用します。ページクラスのパブリックメンバおよびプロテクトメンバのみがデータ連結式で使用可能なので、このプロパティはパブリックです。

各 SiteInfo オブジェクトには、SiteName および SiteURL の 2 つのプロパティがあります。これらのプロパティは、テンプレート内の HyperLink コントロールにデータが連結されるときにアクセスされます。このコントロールの連結式では、Container.DataItem が特定のアイテムが連結している 1 つの SiteInfo オブジェクトを表します。DataBinder.Eval(Container.DataItem, "SiteName") は、現在の SiteInfo オブジェクトの SiteName プロパティにアクセスします。

Repeater1 サンプルではいくつかの基本的な概念を示しています。

テンプレートの定義
テンプレート内のデータ連結構文およびデータ連結式
データソースとしての ArrayList の ICollection インプリメンテーションの使用
ページの初期化処理での DataBind メソッドの呼び出し

DataList コントロール

DataList コントロールは、スタイルプロパティを使用して表示外観を書式化する能力を提供する、テンプレートを使用したコントロールです。複数列のレイアウトも作成できます。図 3 でこれらの機能の両方を示します。

図 3. DataList の 2 列表示から作成されたサンプル

DataList1.aspx:

<%@ Page language="C#" src=">
  </property>
  <template
      name="ItemTemplate">
    <asp:Panel runat=server
      font-size="12pt"
      font-bold="true">
      <%#
      ((Person)Container.DataItem).Name %>
   
      </asp:Panel>
    <asp:Label runat=server
      Width="20px"
      BorderStyle="Solid"
      BorderWidth="1px"
      BorderColor="Black"
      BackColor='<%#
      ((Person)Container.DataItem).FavoriteColor
      %>'>&nbsp;
   
      </asp:Label>
    &nbsp;
   
      <asp:Label runat=server
      Font-Size="10pt"
      Text='<%#
      GetColorName(((Person)Container.DataItem).FavoriteColor)
      %>'>
   
      </asp:Label>
  </template>
</asp:DataList>

上記の .aspx ファイルは、このサンプルを作成するために使用した DataList の宣言を示しています。

このサンプルでは、複数列の DataList のレイアウトを RepeatColumns のプロパティを "2" に設定することで実現しています。RepeatDirection を "Vertical" に設定することで、アイテムは上から下に、その後左から右に表示されます。逆に、"Horizontal" にすると、アイテムは左から右に、その後上から下に表示されます。

aspx 構文は DataList のスタイルプロパティの小さなセットを含んでいます。この例では、DataList の Width は親の 100% に設定されています。灰色の背景を指定して AlternatingItemStyle を設定することにより、帯状の外観を作成します。このサンプルでは、テンプレートが各アイテム内に希望のレイアウトを実現するために必要な、任意の複雑なコントロールの定義を含むことができることも示しています。

最後に、このテンプレート内のデータ連結式は Container.DataItem をその型にキャストすることで事前バインディングを使用しています。Repeater1 で示しているように DataBinder.Eval の使用と関連付けられている実行時バインディングのコストは発生しません。ただし、このメソッドは可読性の低い式を作成する可能性があります。次のサンプルは、このページのファイル内のコードに実装されている GetColorName メソッドを呼び出す式の例も示しています。

DataList1.cs:

namespace Samples {
   
      ...

    public class DataList1Page : Page
      {
        protected DataList
      peopleDataList;

        protected
      string GetColorName(Color c)
      {
            return
              TypeDescriptor.GetConverter(typeof(Color)).ConvertToString(c);
        }
        
        private
      void LoadPeopleList()
      {
            // データ ソースを作成します
            Person[]
      people = new Person[]
      {
               
      new Person("Nikhil Kothari",
      Color.Green),
               
      new Person("Steve Millet",
      Color.Purple),
               
      new Person("Chris Anderson",
      Color.Blue),
               
      new Person("Mike Pope",
      Color.Orange),
               
      new Person("Anthony Moore",
      Color.Yellow),
               
      new Person("Jon Jung",
      Color.MediumAquamarine),
               
      new Person("Susan Warren",
      Color.SlateBlue),
               
      new Person("Izzy Gryko",
      Color.Red)
            };

            // コントロールのデータ ソースを設定します
            peopleDataList.DataSource
      =
      people;

            // データソースを使用してコントロールのアイテムを作成します
            peopleDataList.DataBind();
        }

        protected
      override void OnLoad(EventArgs e)
      {
            base.OnLoad(e);

            if
      (!IsPostBack)
      {
               
      // ページに対する最初の要求
               
      LoadPeopleList();
            }
        }
   
      }

    public sealed class Person
      {
        private string
      name;
        private Color
      favoriteColor;

        public
      Person(string name, Color favoriteColor)
      {
            
      this.name =
      name;
            
      this.favoriteColor =
      favoriteColor;
        }

        public
      Color FavoriteColor
      {
            get
      { return favoriteColor;
      }
        }
        public
      string Name
      {
            get
      { return name;
      }
        }
   
      }
}

aspx ファイルでは宣言して設定されましたが、このページではコントロールの DataSource プロパティはプログラムで設定されます。どちらの方法も結果は同じです。どちらの方法を選択しても、コントロールがデータソースを列挙し、表示するアイテムを作成するするために DataBind メソッドを呼び出す必要があります。

このサンプルで使用されているデータソースは、Person オブジェクトの単純な配列です。すべての配列が ICollection を実装しているため、配列はデータソースとして使用するのに適しています。このことは、データ構造体およびデータ型をデータソースとして使用するときに利用できる柔軟性の程度を示しています。

DataList1 サンプルは以下の概念を示します。

テンプレート内の豊富な HTML UI 定義
データソースとしての単純配列の使用
プログラムによるデータソースの設定
データ連結構文内で許可されているさまざまな式

DataGrid コントロール

DataGrid コントロールを使用して、データソースを豊富な書式の表形式で表示できます。さらに、ほかの操作に従ったアイテムの選択もサポートしています。

このセクションの 4 つのサンプルは、本のタイトルについての情報を含んでいるテーブルを使用しています。このテーブルはタイトル、タイトル ID、著者、および出版年です。すべてのデータは TitlesDB.xml 内で XML を使用して保存されています。これらのサンプルはこのテーブルの内容を表示するためと本を選択するために、ページを作成するとき段階的なアプローチを採用しています。サンプルは、前のサンプルを元にして構築されているので、コードリストでは変更点を太字のテキストで示しています。

TitlesDB.xml:

<root>
<schema id="DocumentElement"
      targetNamespace=""
        xmlns=http://www.w3.org/1999/XMLSchema
        xmlns:msdata="urn:schemas-microsoft-com:xml-msdata">
   
      <element
      name="Title">
        <complexType
      content="elementOnly">
            <element
      name="title_id"
      type="string"></element>
            <element
      name="title"
      type="string"></element>
            <element
      name="au_name"
      type="string"></element>
            <element
      name="price"
      msdata:DataType="System.Currency"
                     minOccurs="0"
                     type="string"></element>
            <element
      name="pubdate"
      type="timeInstant"></element>
        </complexType>
        <unique
      name="TitleConstraint"
      msdata:PrimaryKey="True">
            <selector>.</selector>
            <field>title_id</field>
        </unique>
   
      </element>
</schema>
<DocumentElement>
   
      <Title>
        <title_id>BU1032</title_id>
        <title>The
      Busy Executive's Database
      Guide</title>
        <au_name>Marjorie
      Green</au_name>
        <price>19.99</price>
        <pubdate>1991-06-12T07:00:00</pubdate>
   
      </Title>
   
      ...
</DocumentElement>
</root>

典型的な Web アプリケーションでは、スケーラビリティとパフォーマンスを最大にするために、Web サービスまたはビジネスオブジェクトを使用してデータにアクセスします。これらのサンプルを簡略化し、データアクセスよりも DataGrid を使用することに焦点を当てると、アプリケーションの起動時にデータを読み込み、以下のように Global.asax 内の ASP アプリケーション状態で、結果としての DataSet をキャッシュします。

Global.asax:

public void Application_OnStart() {
   
      FileStream fs = null;
    DataSet ds =
      null;

    try
      {
        fs = new
      FileStream(Server.MapPath("TitlesDB.xml"),
      FileMode.Open,
                           
      FileAccess.Read);
        ds =
      new DataSet();

        // xml ファイルから DataSet にデータを読み込みます
        ds.ReadXml(fs);
   
      } finally {
        if (fs !=
      null)
      {
            fs.Close();
            fs
      =
      null;
        }
   
      }

    // 個別のページで使用するために Dataset をアプリケーション状態にキャッシュします
    Application["TitlesDataSet"] =
      ds;
}

DataGrid1

DataGrid1 は DataGrid の基本的な使用法を示します。コントロールが最小限のユーザーコードで表示されるための実質的な機能を提供する方法を示します。

図 4. 自動生成された列を持つ DataGrid を使用して作成されたサンプル

DataGrid1.aspx:

<%@ Page language="C#" src="asp:DataGrid>

上記の .aspx ファイルはプロパティの設定を行わない DataGrid コントロールの宣言を示しています。

DataGrid.cs:

namespace Samples {
   
      ...

    public class DataGridPage : Page
      {
        protected DataGrid
      titlesGrid;

        public
      ICollection GetTitlesList()
      {
            // アプリケーション状態にキャッシュされた DataSet から
            // タイトルの一覧を取得します。
            DataSet
      titlesDataSet =
      (DataSet)Application["TitlesDataSet"];

            if
      (titlesDataSet != null)
      {
               
      return
      titlesDataSet.Tables["Title"].DefaultView;
            }
            else
      {
               
      return
      null;
            }
        }

        private
      void LoadTitlesGrid()
      {
            // データベースからデータを取得します
            ICollection
      titlesList =
      GetTitlesList();

            // コントロールのデータ ソースを設定します
            titlesGrid.DataSource
      =
      titlesList;

            // データ ソースを使用してコントロールのアイテムを作成します
            titlesGrid.DataBind();
        }

        protected
      override void OnLoad(EventArgs e)
      {
            base.OnLoad(e);

            if
      (!IsPostBack)
      {
               
      // ページに対する最初の要求
               
      LoadTitlesGrid();
            }
        }
   
      }
}

.cs ファイルはページで使用されるコードを含んでいます。このコードは機能的には DataList1 サンプルで使用したコードと同等です。このコードは、データを取得し、ページに対する最初の要求で DataBind の呼び出しに続いてコントロールの DataSource プロパティを設定するために、OnLoad メソッドをオーバーライドします。これによって DataGrid は、本質的にはテーブルの行であるアイテムを作成します。ポストバック処理の間、DataGrid は前回の要求で保存されたセルの内容を含む状態からアイテムを再作成します。

このサンプルは、DataGrid の AutoGenerateColumns プロパティの機能を示します。このプロパティは既定値 True を保持しています。Trueを設定すると、DataGrid はリフレクションを使用してデータソースとそのオブジェクトを調べ、各パブリックプロパティまたはフィールドに対して列を作成します。このサンプルでは、コントロールは "Title" テーブル内のすべてのフィールドを表示します。この機能を使用すると最小限のユーザーコードで、データソースの表形式の表示を迅速、かつ容易に行うことができます。

自動的に作成される各列の型は BoundColumn です。この型の列はテーブルセルのテキストとして使用するために、関連付けられているプロパティ値を文字列に変換します。

DataGrid2

DataGrid2 は .aspx ファイルで定義された Columns コレクションを持つ DataGrid を示します。

図 5. 指定した列を持つ DataGrid を使用して作成されたサンプル

DataGrid2.aspx:

<%@ Page language="C#" src="B>
  <property
      name="Columns">
    <asp:BoundColumn
      HeaderText="Title" DataField="title"/>
   
      <asp:BoundColumn HeaderText="Author"
      DataField="au_name"/>
    <asp:BoundColumn
      HeaderText="Date Published"
      DataField="pubdate"/>
    <asp:BoundColumn
      HeaderText="Price"
      DataField="price"/>
  </property>
</asp:DataGrid>

.aspx ファイルは、ユーザー指定の Columns コレクションを持つ DataGrid コントロールを示しています。このサンプルでは、コードの変更が必要ないので DataGrid1 と同じファイル内のコードを使用しています。

DataGrid の AutoGenerateColumns プロパティは、コントロールが自動的に列を作成しないように、またテーブル内で表示される列をユーザーの責任で定義するように False が設定されています。

多くの利点が結果として生じます。

列の順序を制御できます。列は宣言した順序で表示されます。反対に、自動的に作成された列はリフレクションを使用して取得した順序で表示されます。この順序は必ずしもコードまたはデータベーステーブルのフィールドの順序と一致する必要はありません。
HeaderText プロパティを使用して、列ごとにキャプションを指定できます。以前のサンプルでは、列のヘッダーはフィールド名を示していましたが、適切でない可能性がありました。列は、このモードでコントロールを使用するときに設定できる追加プロパティを提供します。
自動生成された列は常に BoundColumn 型です。列のコレクションを指定すると、ユーザーは列ごとに型を指定できます。

DataGrid3

DataGrid3 は DataGrid2 に表示の書式化および内容の書式化を追加して構築されました。

図 6. スタイルプロパティと書式化プロパティを設定した DataGrid によって作成されたサンプル

DataGrid3.aspx:

<%@ Page language="C#" src="B>
     BackColor="White"
     BorderWidth="1px"
      BorderStyle="Solid" CellPadding="2"
      CellSpacing="0"
     BorderColor="Tan"
     Font-Name="Verdana"
      Font-Size="8pt">
  <property
      name="Columns">
    <asp:BoundColumn
      HeaderText="Title" DataField="title"/>
   
      <asp:BoundColumn HeaderText="Author"
      DataField="au_name"/>
    <asp:BoundColumn
      HeaderText="Date Published"
      DataField="pubdate"
         DataFormatString="{0:MMM
      yyyy}"/>
    <asp:BoundColumn
      HeaderText="Price"
      DataField="price"
      DataFormatString="{0:c}">
      <property
      name="ItemStyle">
        <asp:TableItemStyle
      HorizontalAlign="Right"/>
      </property>
   
      </asp:BoundColumn>
  </property>

  <property
      name="HeaderStyle">
    <asp:TableItemStyle
      BackColor="DarkRed"
      ForeColor="White"
      Font-Bold="true"/>
  </property>
  <property
      name="ItemStyle">
    <asp:TableItemStyle
      ForeColor="DarkSlateBlue"/>
  </property>
  <property
      name="AlternatingItemStyle">
   
      <asp:TableItemStyle
      BackColor="Beige"/>
  </property>
</asp:DataGrid>

.aspx ファイルは、前のサンプルと同様さまざまなスタイルプロパティの設定を持つ DataGrid コントロール宣言を示しています。これによって外観的に魅力のある表示を可能にします。また、コードの変更は必要なく、前のサンプルと同じファイル内のコードが使用されています。

DataGrid コントロールは WebControl から派生しているので、Width、BackColor、BorderStyle、および Font.Name などのスタイルプロパティを継承しています。また、DataGrid は CellPadding のような表固有のプロパティも提供しています。これらのプロパティは、コントロールの全体的なカスタマイズを可能にしています。

宣言は HeaderStyle および AlternatingItemStyle など、設定されるいくつかのアイテムスタイルを示しています。これらのスタイルは対応するアイテムの外観を制御します。サンプルでは、スタイルのマージが発生していることに注意してください。代替のアイテムはスタイルが共に AlternatingItemStyle および ItemStyle の構成なので、正規のアイテムと同じ前景色を持ちます。このサンプルは、また、price 列内のテキストを右詰めにすることで特定の列のスタイルを設定していることも示しています。

DataGrid を使用すると、セル内でテキストの内容を書式化することもできます。これは BoundColumn の DataFormatString プロパティの値を設定することで実行されます。列は String.Format を使用しているセルの内容を書式化するために書式指定を使用します。このプロパティは Dates および Currencies などの書式型と共に、任意の内容の前に追加または後に追加することを可能にします。さらに、書式は現在のページの CultureInfo を使用してアカウントに要求するので、グローバリゼーションも可能にします。書式が指定されていないときは、値の ToString メソッドが使用されます。

DataGrid4

DataGrid4 は SelectedIndexChanged イベントを処理することにより、DataGrid 内の選択を使用する方法を示しています。

図 7. アイテムに含まれる選択を許可しているDataGrid によって作成されたサンプル

DataGrid4.aspx:

<%@ Page language="C#" src="B>
     OnSelectedIndexChanged="OnSelectedIndexChangedTitlesGrid">
  <property
      name="Columns">
    <asp:ButtonColumn
      Text="Select" Command="Select"/>
   
      <asp:BoundColumn HeaderText="Title"
      DataField="title"/>
    <asp:BoundColumn
      HeaderText="Author" DataField="au_name"/>
   
      <asp:BoundColumn HeaderText="Date Published"
      DataField="pubdate"
         DataFormatString="{0:MMM
      yyyy}"/>
    <asp:BoundColumn HeaderText="Price"
      DataField="price"
      DataFormatString="{0:c}">
      <property
      name="ItemStyle">
        <asp:TableItemStyle
      HorizontalAlign="Right"/>
      </property>
   
      </asp:BoundColumn>
  </property>

  <property
      name="HeaderStyle">
    <asp:TableItemStyle
      BackColor="DarkRed"
      ForeColor="White"
      Font-Bold="true"/>
  </property>
  <property
      name="ItemStyle">
    <asp:TableItemStyle
      ForeColor="DarkSlateBlue"/>
  </property>
  <property
      name="AlternatingItemStyle">
   
      <asp:TableItemStyle
      BackColor="Beige"/>
  </property>
  <property
      name="SelectedItemStyle">
    <asp:TableItemStyle
      BackColor="PaleGoldenRod"
      Font-Bold="true"/>
  </property>  
</asp:DataGrid>
...
<asp:Label
      runat=server id="selectionInfoLabel" Font-Name="Verdana"
      Font-Size="8pt"/>

この .aspx ファイルでは、イベントハンドラは DataGrid の SelectedIndexChanged イベントに登録されます。イベントハンドラはファイル内のコードに実装されます。"Select" Command を指定した ButtonColumn が Columns コレクションに追加されることにより、DatGrid はアイテムごとに Select ボタンを持つ追加の列を表示します。SelectedItemStyle も指定されています。このスタイルは選択されたアイテムを表示上区別するために使用されます。最後に、DataGrid の DataKeyField プロパティも指定されています。このフィールドが DataGrid の DataKeys コレクションにデータを設定します。このフィールドは、DataGrid のコードで使用されます。

DataGrid4.cs:

namespace Samples {
   
      ...

    public class DataGrid4Page : Page
      {
        protected DataGrid
      titlesGrid;
        protected
      Label
      selectionInfoLabel;

        public
      ICollection GetTitlesList()
      {
            // アプリケーション状態にキャッシュした DataSet から
            // タイトルのリストを取得します。
            DataSet
      titlesDataSet =
      (DataSet)Application["TitlesDataSet"];

            if
      (titlesDataSet != null)
      {
               
      return
      titlesDataSet.Tables["Title"].DefaultView;
            }
            else
      {
               
      return
      null;
            }
        }

        private
      void LoadTitlesGrid()
      {
            // データベースからデータを取得します
            ICollection
      titlesList =
      GetTitlesList();

            // コントロールのデータ ソースを設定し、選択をリセットします
            titlesGrid.DataSource
      =
      titlesList;
            titlesGrid.SelectedIndex
      =
      -1;

            // データ ソースを使用してコントロールのアイテムを作成します
            titlesGrid.DataBind();

            // 選択したタイトル情報を更新します
            UpdateSelectedTitleInfo();
        }

        protected
      override void OnLoad(EventArgs e)
      {
            base.OnLoad(e);

            if
      (!IsPostBack)
      {
               
      // ページに対する最初の要求
               
      LoadTitlesGrid();
            }
        }

        // DataGrid の OnSelectedIndexChanged
      イベントの処理
        protected
      void OnSelectedIndexChangedTitlesGrid(object sender,
                                                        EventArgs e) {
            UpdateSelectedTitleInfo();
        }

        private
      void UpdateSelectedTitleInfo()
      {
            // 選択項目のインデックスを取得します
            int
      selIndex =
      titlesGrid.SelectedIndex;
            string
      selTitleID =
      null;
            string
      selectionInfo;

            if
      (selIndex != -1)
      {
               
      // 選択されたタイトルのキー フィールドを表示します
               
      selTitleID =
      (string)titlesGrid.DataKeys[selIndex];
               
      selectionInfo = "ID of selected title: " +
      selTitleID;
            }
            else
      {
               
      selectionInfo = "No title is currently
      selected.";
            }

            selectionInfoLabel.Text
      =
      selectionInfo;
        }
   
      }
}

上記の .cs ファイルは SelectedIndexChanged イベントを処理し、および DataGrid 以下の選択されたタイトルの ID を表示するためのロジックを含んでいます。DataGrid はアイテム内にあるボタンによって送られる Command イベントを処理します。DataGrid は標準コマンド "Select" を認識します。この標準コマンドは SelectedIndex プロパティを変更し、イベントを発生することによりユーザーコードの変更を通知します。

イベントハンドラのインプリメンテーションでは、サンプルコードが UpdateSelectedTitleInfo メソッドを呼び出しています。このメソッドは選択されたタイトル情報 (この場合、タイトルの ID) を表示する役目があります。現実的なシナリオでは、この ID は選択されたタイトルの詳細を表示するページへのリンクに使用できます。

ID は DataKeys コレクションにアクセスして取得します。このコレクションは DataKeys プロパティを設定すると値が設定されます。一般的に、これは主キーまたはアイテムを一意に識別するユーザーコードを許可するほかの一部のフィールドに設定されます。その情報はその後のデータベースクエリおよびデータのフィルタ処理の条件として使用されます。

このサンプルでは DataGrid はデータソースでのオブジェクトの表示のみではなく、オブジェクトの選択などの操作を可能にするための使用方法を示しています。DataGrid は、並べ替え、ページ処理、インプレイス編集、および TemplateColumns などのほかのいくつかの機能をサポートします。ただし、これらの固有の機能は本稿で説明する範囲を超えているので、別の記事を参照してください。

Repeater、DataList、または DataGrid とは?

Repeater 、DataList 、および DataGrid コントロールは、共通のプログラミングモデルを共有します。同時に、各コントロールは特定のシナリオを想定して設計されています。シナリオに合ったリスト連結コントロールを選択することが重要です。このセクションでは、各コントロールが使用される標準的なシナリオの例を示しながら、コントロールの階層とこれらのコントロールの機能について説明します。

次のクラス階層から分かるように、Repeater は小さくて軽量なコントロールです。ID プロパティや子 Controls コレクションなどの、基本的な Control クラスの機能のみを継承しています。対照的に、DataList コントロールと DataGrid コントロールは共に、スタイルプロパティや表示プロパティなどの WebControl 機能を継承しています。

図 8. リスト連結コントロールのクラス階層

Repeater コントロールは、オブジェクトモデルの観点からは最も単純なコントロールです。最小のデータ連結コントロールであり、本質的に表示されないので、特定の UI レイアウトを適用しません。最終的な表示は、コントロールに指定されたテンプレートの内容の繰り返しによる、テキスト生成アプローチに従います。コントロールはスタイルプロパティと表示プロパティまたは動作に対して組み込みのサポートを提供しません。Repeater コントロールは表示を完全に制御することが必要なシナリオに最適です。

DataList コントロールは、縦割りデータ形式レイアウトまたはフローレイアウトのいずれかを適応する Repeater です。コントロールは WebControl に実装されている表示プロパティを継承し、作成するアイテムに適用する付加的なスタイルプロパティを追加します。選択、編集および削除などのアイテムの標準的な操作もサポートします。DataList コントロールは、水平的な流れまたは垂直的な流れで一連のアイテムを作成し、そのアイテムが 1 列以上に渡っている場合に適しています。

DataGrid コントロールは、列と行の表形式のレイアウトに適応します。DataList と同様、このコントロールはスタイルプロパティと表示プロパティを提供します。選択と編集に加えて、DataGrid はすべてのアイテムコレクションに対してページ処理や並べ替えなどの高度な操作をサポートします。DataGrid と DataList の重要な違いは、DataGrid にはテンプレートプロパティがないことです。これはコントロールのアイテムや行がテンプレートを使用していないということを意味します。ただし、DataGrid に TemplateColumn を追加することで特定の列内でテンプレートの使用が可能になります。

次の表は、リスト連結コントロールが提供する機能の要約です。

機能	Repeater	DataList	DataGrid
テンプレート	有 (必須)	有 (必須)	列内 (オプション)
表形式のレイアウト	無	無	有
フローレイアウト	有	有	無
新聞、雑誌などの縦割り形式のレイアウト	無	有	無
スタイルプロパティと表示プロパティ	無	有	有
選択	無	有	有
編集	無	有	有
削除	無	有	有
ページ処理	無	無	有
並べ替え	無	無	有

目次