DataList Web サーバー コントロールの概要
更新 : 2007 年 11 月
DataList Web サーバー コントロールは、カスタマイズできる形式でデータベース情報の行を表示します。データの表示形式は、テンプレートを作成して定義します。項目、代替項目、選択された項目、および編集項目のテンプレートを作成できます。ヘッダー、フッター、および区切り記号の各テンプレートを使用して DataList の表示形式全体をカスタマイズすることもできます。Button Web サーバー コントロールをテンプレートに含めることにより、一覧の項目に対して、ユーザーが表示、選択、編集の各モードを切り替えることができるようにするコードを関連付けることができます。
このトピックの内容は次のとおりです。
背景
コード例
クラス リファレンス
背景
DataList Web サーバー コントロールは、テンプレートおよびスタイルを使用して定義できる形式でデータを表示します。DataList コントロールは、テーブルなどの反復構造内のデータの表示に便利です。DataList コントロールは、行を列や行で順序付けるなど、行をさまざまなレイアウトで表示できます。
メモ : |
---|
DataList コントロールは、HTML テーブル要素を使用して項目の一覧を表示します。一覧の表示に使用する HTML 要素を正確に制御するには、DataList コントロールの代わりに Repeater Web サーバー コントロールを使用してください。 |
また、DataList コントロールは、ユーザーが情報を編集または削除できるように設定することもできます。さらに、その他の機能 (行の選択など) をサポートするようにカスタマイズできます。
テンプレートに HTML テキストおよびコントロールを含めることにより、テンプレートを使用してデータ項目のレイアウトを定義します。たとえば、項目の Label Web サーバー コントロールを使用してデータ ソースのフィールドを表示できます。
以下のセクションでは、DataList コントロールの機能を紹介します。
コントロールへのデータの連結
DataList Web サーバー コントロールは、データ ソースに関連づける必要があります。最も一般的なデータ ソースは、SqlDataSource コントロールや ObjectDataSource コントロールなどのデータ ソース コントロールです。また、DataList コントロールは、IEnumerable インターフェイスを実装する任意のクラスに関連付けることもできます。クラスには、ADO.NET データセット (DataSet クラス)、データ リーダー (SqlDataReader クラスやOleDbDataReader クラス)、またはほとんどのコレクションが含まれます。データを関連付けるときは、DataList コントロール全体に対して 1 つのデータ ソースを指定します。このコントロールにその他のコントロール (たとえば、一覧項目のラベルまたはテキスト ボックス) を追加する場合は、子コントロールのプロパティを現在のデータ項目のフィールドに関連付けることができます。
DataList 項目のテンプレートの定義
DataList コントロールでは、テンプレートを使用して情報のレイアウトを定義できます。
メモ : |
---|
テンプレートの使用の概要については、「ASP.NET Web サーバー コントロール テンプレート」を参照してください。 |
DataList コントロールでサポートされているテンプレートを次の表に示します。
テンプレート プロパティ |
説明 |
---|---|
データ ソースの各行に対して一度ずつ表示される HTML 要素とコントロールが含まれます。 |
|
データ ソースの 1 行おきに表示される HTML 要素とコントロールが含まれます。通常、このテンプレートは、交互に行の表示形式を変化させる (ItemTemplate プロパティで指定した色とは別の背景色など) ときに使用します。 |
|
ユーザーが DataList コントロールの項目を選択したときに表示される要素が含まれます。通常、このテンプレートは、選択した行を、異なる背景色やフォント色で視覚的に区別するときに使用します。データ ソースから追加のフィールドを表示することにより、項目を拡張することもできます。 |
|
編集モードでの項目のレイアウトを指定します。このテンプレートには、通常、TextBox コントロールなどの編集コントロールが含まれています。 |
|
一覧の最初と最後にそれぞれ表示されるテキストおよびコントロールが含まれます。 |
|
各項目の間に表示される要素が含まれます。代表的な例はライン (HR 要素を使用) です。 |
スタイル
テンプレートのスタイルを設定して、テンプレートの項目の表示形式を指定できます。たとえば、以下のように指定します。
項目は、白い背景に黒のテキストで表示する。
交互の項目は、明るい灰色の背景に黒のテキストで表示する。
選択された項目は、黄色い背景に太字の黒のテキストで表示する。
編集対象の項目は、明るい青の背景に黒のテキストで表示する。
各テンプレートは、デザイン時および実行時にプロパティを設定できる固有のスタイル オブジェクトをサポートします。使用できるスタイルは次のとおりです。
詳細については、「ASP.NET Web サーバー コントロールと CSS スタイル」を参照してください。
項目のレイアウト
DataList コントロールは、HTML テーブルを使用して、テンプレートが適用される項目の表示をレイアウトします。DataList 項目の表示に使用する個々のテーブル セルの列の順序、方向、および数を制御できます。DataList コントロールでサポートされているレイアウト オプションを次の表に示します。
レイアウト オプション |
説明 |
---|---|
フロー レイアウト |
フロー レイアウトの場合、一覧の項目は、ワード プロセッサ文書のようにインラインで表示されます。 |
テーブル レイアウト |
テーブル レイアウトの場合、項目は HTML テーブルに表示されます。このレイアウトでは、グリッド線などのテーブルセル プロパティを設定できるので、より多くのオプションを使用して項目の表示形式を指定できます。詳細については、「方法 : DataList Web サーバー コントロールでフローまたは表の形式を指定する」を参照してください。 |
縦横レイアウト |
既定では、DataList コントロールの項目は縦の 1 列に表示されます。ただし、コントロールが複数の列を持つようにも指定できます。複数の列を指定する場合は、項目を (新聞の段組のように) 縦に並べるか、(カレンダーの日付のように) 横に並べるかを指定できます。詳細については、「方法 : DataList Web サーバー コントロールに横または縦のレイアウトを指定する」を参照してください。 |
列の数 |
DataList コントロールの項目を縦と横のどちらの方式で並べる場合にも、一覧に含む列の数を指定できます。列数を指定することで、通常、水平のスクロールを使用しないように、表示される Web ページの幅を制御できます。 |
イベント
DataList コントロールは、複数のイベントをサポートします。サポートされるイベントのうち ItemCreated は、実行時に項目作成プロセスをカスタマイズする手段を提供します。ItemDataBound イベントも DataList コントロールをカスタマイズする機能を提供します。ただし、このイベントはデータが検査できるようになった後にしか使用できません。たとえば、DataList コントロールを使用して TO DO リストを表示する場合に、期限の過ぎた項目を赤いテキスト、完了した項目を黒いテキスト、その他のタスクを緑のテキストで表示できます。どちらのイベントを使用しても、テンプレート定義による形式設定をオーバーライドできます。
残りのイベントは、一覧項目でのボタン クリックに対する応答として発生します。これらのイベントは、DataList コントロールで最も一般的に使用される機能に対応できるようにデザインされています。この種類のイベントは、次の 4 つがサポートされます。
これらのイベントが発生するようにするには、Button コントロール、LinkButton コントロール、または ImageButton コントロールを DataList コントロールのテンプレートに追加し、各ボタンの CommandName プロパティに、edit、delete、update、cancel などのキーワードを設定します。ユーザーが項目のボタンをクリックすると、イベントはボタンのコンテナ、つまり DataList コントロールに送られます。ボタンによって発生する実際のイベントは、クリックされたボタンの CommandName プロパティの値によって決まります。たとえば、ボタンの CommandName プロパティに edit が設定されている場合、ボタンをクリックすると、EditCommand イベントが発生します。また、CommandName プロパティに delete が設定されている場合は、DeleteCommand イベントが発生します。
DataList コントロールは、edit や delete などの定義済みのコマンドが設定されていないボタンをクリックしたときに発生する ItemCommand イベントもサポートします。ボタンの CommandName プロパティに必要な値を設定し、ItemCommand イベント ハンドラでテストすることにより、カスタム機能のためにこのイベントを使用できるようになります。たとえば、この方法は、「方法 : ユーザーが DataList Web サーバー コントロール内の項目を選択できるようにする」で説明されているように項目を選択するときに使用できます。
Web フォーム イベントの詳細については、「ASP.NET Web サーバー コントロールのイベント モデル」を参照してください。
項目の編集と選択
コントロールの各項目をユーザーが編集できるようにすることができます。GridView、DetailsView、FormView などの他のデータ コントロールは、データ ソース コントロールと対話して、自動的な更新やページングをサポートします。一方、DataList コントロールは、データ ソース コントロールの更新機能、自動ページング、および自動並べ替え機能を自動的には利用できません。DataList コントロールを使用して更新、ページング、および並べ替えを実行するには、作成したコードで更新タスクを実行する必要があります。
一般的な方法としては、編集用の適切なレイアウトおよびコントロールを提供する EditItemTemplate を作成します。また、ユーザーが項目を編集しようとしていることを示すための手段も用意する必要があります。この場合、ボタンを項目テンプレートに追加し (項目テンプレートを使用する場合は、AlternatingItemTemplate プロパティに追加します)、ボタンの CommandName プロパティに edit を設定する方法がよく使用されます。これで、ボタンをクリックしたときに、DataList コントロールによって EditCommand イベントが自動的に発生します。イベント ハンドラ用に作成するコードで、項目を編集モードに設定すると、EditItemTemplate が表示されます。
通常、EditItemTemplate には、ユーザーが変更を保存したり、破棄したりできるボタン ([更新] ボタンや [キャンセル] ボタンなど) が含まれています。これらのボタンは、[編集] ボタンと同じように動作し、定義済みのコマンド メッセージ (update または cancel) を DataList コントロールに送ります。このコントロールは、適切に応答できる UpdateCommand イベントや CancelCommand イベントを発生します。詳細については、「方法 : ユーザーが DataList Web サーバー コントロール内の項目を編集できるようにする」を参照してください。
項目を選択するプロセスでは、SelectedIndexChanged イベントを使用しますが、上記のプロセスと似ています。ボタンを ItemTemplate に追加し、その CommandName プロパティに select を設定します。そして、SelectedIndexChanged イベントのイベント ハンドラを記述します。これで、ユーザーが [選択] ボタンをクリックすると、SelectedIndexChanged イベントが発生します。詳細については、「方法 : ユーザーが DataList Web サーバー コントロール内の項目を選択できるようにする」を参照してください。詳細については、「方法 : ユーザーが DataList Web サーバー コントロール内の項目を選択できるようにする」を参照してください。
ページのトップへ
コード例
方法 : DataList Web サーバー コントロールでフローまたは表の形式を指定する
方法 : DataList Web サーバー コントロールに横または縦のレイアウトを指定する
方法 : ユーザーが DataList Web サーバー コントロール内の項目を選択できるようにする
方法 : ユーザーが DataList Web サーバー コントロール内の項目を編集できるようにする
方法 : ユーザーが DataList Web サーバー コントロール内の項目を削除できるようにする
方法 : DataList 項目または Repeater 項目のボタン イベントに応答する
方法 : DataList Web サーバー コントロールの項目を動的にカスタマイズする
方法 : DataList Web サーバー コントロールのテンプレートを動的に作成する
方法 : DataList Web サーバー コントロールを ASP.NET Web ページに追加する
チュートリアル : DataList Web サーバー コントロールを使用したデータの表示および書式指定
ページのトップへ
クラス リファレンス
DataList コントロールに関連する主要なクラスの一覧を次の表に示します。
メンバ |
説明 |
---|---|
コントロールのメイン クラスです。 |
ページのトップへ
参照
概念
ASP.NET Web サーバー コントロール テンプレート