第6回 Webサーバ・コントロール（前編）：連載 プログラミングASP.NET ―ASP.NETによるWebアプリケーション実践開発講座― （1/4 ページ）
ASP.NETにはWebページのGUI部品となるさまざまなコントロールが用意されている。今回はそれらの基礎とボタン部品について解説する。
前々回および前回で、ASP.NETページのフレームワークとなるPageクラスについて解説を終えたので、今回からは数回に分けてサーバ・コントロールについて解説する。サーバ・コントロールはページにレイアウトされる、一種の拡張HTMLエレメントである。基本的にはHTMLで定義されるinputタグやselectタグの拡張版であり、フォームにレイアウトしてユーザーとのインターフェイスを構築するためのパーツだが、それだけではなく、複数のHTMLエレメントが出力されるWin32プログラミングにおけるリストビュー・コントロールに相当するような、データを整形してテーブルとして出力する高度なサーバ・コントロールなども用意されている。
ところで、本連載の第1回に、サーバ・コントロールにはWebサーバ・コントロールとHTMLサーバ・コントロールの2種類があることを解説したが、まずはWebサーバ・コントロールの解説から進めていくことにする。HTMLサーバ・コントロールは、既存のHTMLページを手軽にASP.NETページ化したり、クライアント・サイド・スクリプトを含むページをデザインしたりするときには有用だが、一般的なASP.NETページではほとんどすべての処理をサーバ・サイドで行うはずで、このような用途にはWebサーバ・コントロールの方が便利なことが多い。従って、まずはWebサーバ・コントロールを使いこなすことから始めるのが妥当だろう。
それから、いくつかお断りしておくことがある。ほとんどのサーバ・コントロールには色やサイズ、フォントなどを設定するスタイル系プロパティが用意されているが、今回はこれらプロパティの解説をひとまず割愛する。より高度なスタイル・テンプレートを利用可能なサーバ・コントロールについても同様である。スタイル・プロパティに設定した値は、実行時にCSS（Cascading Style Sheet）のコードへと変換されるため、後でCSSの解説を交えて解説する予定である。また、サーバ・コントロールへの値設定に利用される、ASP.NETの最も特徴的な機能ともいえるデータ連結だが、これはサーバ・コントロールの種類によらず共通して機能するため、次回以降まとめて解説する。
サーバ・コントロールの基礎
個々のWebサーバ・コントロールを解説する前に、まずはすべてのサーバ・コントロールに共通する、サーバ・コントロールの書式、値の設定、それにイベント・ハンドリングについて解説しておく。
■サーバ・コントロールの書式
Webサーバ・コントロールは、HTMLの拡張エレメントとして設計されているため、ASP.NETページにレイアウトするには、bodyエレメント内部の表示したい場所に、次の書式でタグを記述すればよい。
| 書式1 | <コントロール名 属性 イベント runat="server" /> |
|---|---|
| 書式2 | <コントロール名 属性 イベント runat="server"> ＜子要素＞… </コントロール名> |
| サーバ・コントロールの書式 | |
<asp:Button id="submit" Text="Submit" OnClick="submit_Click" runat="server" />
<asp:ListBox id="listbox1" runat="server">
<asp:ListItem>Windows XP</asp:ListItem>
<asp:ListItem>Windows 2000</asp:ListItem>
</asp:ListBox>
基本的な書式はHTMLと同じだが、子要素を持たないWebサーバ・コントロールは、書式1のように自己終了タグを利用することで、終了タグを省略することが可能である。子要素を持たないWebサーバ・コントロールでも、書式2のように開始タグと終了タグを記述することは可能だが、この場合HTMLのpエレメントのように終了タグを省略することはできず、必ず開始タグと終了タグが対になるように記述しなければならない。
そのほかに注意すべきは、runat="server"の記述忘れである。これを忘れると、そのタグはサーバ・サイドで認識されることなく、そのままブラウザに送られてしまうが、ブラウザもWebサーバ・コントロールを認識することはできないので、結局何も表示されず、運が悪ければエラーも発生しない。runat="server"を記述する位置はタグ内部のどこでも構わないので、“コントロール名”の直後に必ずrunat="server"を記述するなど、一貫したルールを作って、これを守るようにしておくとよいだろう。
ところで、一部のWebサーバ・コントロールでは、次のようにテキストを属性Textに指定することも、子要素のリテラルとして指定することもできるようになっているが、属性Textを持つすべてのWebサーバ・コントロールでこの書式が許されているわけではなく、一貫性がないため、特別な理由がなければ使わない方がいいだろう。
- テキストを属性Textで指定
<asp:HyperLink Text="@IT" NavigateUrl="http://www.atmarkit.co.jp/" runat="server" /> - テキストを子要素のリテラルとして指定
<asp:HyperLink NavigateUrl="http://www.atmarkit.co.jp" runat="server">
@IT
</asp:HyperLink>
以上の書式にのっとって記述すればWebサーバ・コントロールが表示されるようになるわけだが、すべてのWebサーバ・コントロールをどこにでも記述できるわけではない。ユーザーの操作を受け付け、サーバ・サイドへ何らかの情報をポストバックするWebサーバ・コントロールは、いずれもformサーバ・コントロールの内部に記述しなければならない。詳しくは表6.1と表6.2に示すとおりだが、asp:DataGridやasp:DataListのように、子要素としてほかのサーバ・コントロールを含められるコントロールは、子要素のコントロール次第では、formサーバ・コントロール内部に記述しなければならない。
| コントロール | 機能概要 |
|---|---|
| asp:AdRotator | バナーを表示 |
| asp:DataGrid | データ・ソースから取得した項目をテーブルに表示 |
| asp:DataList | データ・ソースから取得した項目を、テンプレートを使用して表示 |
| asp:HyperLink | 別のWebページに移動するためのリンクを表示 |
| asp:Image | イメージを表示 |
| asp:Label | テキストを表示（スタイルを適用可） |
| asp:Literal | テキストを表示（スタイルを適用不可） |
| asp:Panel | ほかのコントロールのコンテナとして機能 |
| asp:PlaceHolder | プログラムで追加するコントロール用の場所を予約 |
| asp:Repeater | データ・ソースから取得した項目を繰り返し表示 |
| asp:Table | テーブルを表示 |
| asp:TableCell | テーブル内のセルを操作 |
| asp:TableRow | テーブル内の行を操作 |
| asp:Xml | XMLドキュメントの表示 |
| 表6.1 formサーバ・コントロール外部に記述できるコントロール一覧 | |
| コントロール | 機能概要 |
|---|---|
| asp:Button | プッシュ・ボタンを作成 |
| asp:Calendar | 1カ月分のカレンダーを表示 |
| asp:CheckBox | チェック・ボックスを作成 |
| asp:CheckBoxList | 複数選択チェック・ボックス・グループを作成 |
| asp:DropDownList | ドロップダウン・リストを表示 |
| asp:ImageButton | クリック可能なイメージを表示 |
| asp:LinkButton | ハイパーリンク・スタイルのボタンを作成 |
| asp:ListBox | リスト・ボックスを表示 |
| asp:RadioButton | オプション・ボタンを作成 |
| asp:RadioButtonList | オプション・ボタンのグループを表示 |
| asp:TextBox | テキスト・ボックスを表示 |
| 表6.2 formサーバ・コントロール内部にしか記述できないコントロール一覧 | |
■サーバ・コントロールの初期値設定
Webサーバ・コントロールに初期値を与えるには、2通りの方法がある。タグの属性として記述する方法と、その属性に対応するプロパティへ値を代入する方法である。Webサーバ・コントロールのタグに記述できる属性は、そのほとんどがプロパティとしてもアクセスできるため、以下に示すTextのように、タグの属性として記述しても、プロパティに値を代入しても、同様に初期値を設定できる。
なお、プロパティのデータ型がstring以外の場合は、属性ごとに設定できる文字列が決まっているが、通常この種の属性は列挙型のプロパティとして定義されているため、属性値にはこの列挙型のメンバ名を指定するようになっている。
- 属性として指定
<asp:TextBox id="textbox1" Text="ASP.NET" runat="server" /> - プロパティに指定
void Page_Load(object sender, EventArgs e) {
if (! IsPostBack) {
textbox1.Text = "ASP.NET";
}
}
以上は、asp:TextBoxコントロールやasp:CheckBoxコントロールのように、コントロールに格納できるデータが1つだけの単一値コントロールの場合である。複数の値を登録できるマルチ・レコード・コントロールでは、もう少し複雑になる。例えば、リスト・ボックスを表示するasp:ListBoxコントロールには、リストに表示するアイテムを複数登録できるわけだが、これを属性値として羅列して指定することはできない。代わりに、この種のWebサーバ・コントロールに初期値を設定する手段は、3種類用意されている。タグの子要素として記述する方法、プログラム・コードでコレクション・オブジェクトに要素を登録する方法、そしてデータ連結を利用する方法である。登録するアイテムが固定値であればWebサーバ・コントロールの子要素として記述できるが、状態に応じて動的にアイテムを登録するには、コレクションに登録するか、データ連結を利用する。この詳細については、各マルチ・レコード・コントロールの項目で解説する。
Copyright© Digital Advantage Corp. All Rights Reserved.