【初心者用】ASP.NETのサーバーコントロールについてまとめてみた～詳細編～
公開日: 2022/9/12
更新日: 2022/9/12
ASP.NET Webフォームで使われるサーバーコントロールについてまとめてみたので、メモがてら記事にします。
今回は、サーバーコントロールの種類や、それぞれの概要について解説していきます。
載せているプログラムの実行環境については、ASP.NETなので、スタンダードにVisualStudioで動かしていきます。
今回は、サーバーコントロールの種類や、それぞれの概要について解説していきます。
載せているプログラムの実行環境については、ASP.NETなので、スタンダードにVisualStudioで動かしていきます。
1. サーバーコントロールの種類
ASP.NET Webフォームで使われるサーバーコントロールは、基本的には「Webサーバーコントロール」「HTMLサーバーコントロール」の２種類に加え、ユーザーが独自に作成する「ユーザーコントロール」の計３種類があります。
ラベルやテキストボックス、ボタンなど、基本的なものもありますが、カレンダーやグリッドビューなどの複雑な機能もあります。
また、HTMLサーバーコントロールとの違いとしては、コントロールとHTMLのタグが、必ずしも１対１に対応しているわけではないという点があります。
例として、カレンダー機能を挙げますが、この機能を提供するCalenderコントロールは配置すると「Table」タグと複数の「a」タグ（Tr,Td等）に変換されます。
このように、複数のタグの組み合わせにより高機能なコントロールを実装できるというのがWebサーバーコントロールの特徴であります。
中には、「検証コントロール」というものもあり、これはユーザーが入力した値に対して検証、つまりチェックを行うコントロールになります。
以下に挙げる例は、「CompareValidator」コントロールという、ユーザーが入力したデータを、もう一つのデータか定数と比較するコントロールですが、これ以外にも入力値が指定した書式になっているかというチェックを行うコントロールも用意されています。
これらは、やろうと思えばプログラムを書いて実装することは可能ですが、予めそういった機能を持つコントロールが実装されている分、開発を効率化できるという利点があります。
メールアドレスとメールアドレス（確認用）の入力内容が等しい
メールアドレスとメールアドレス（確認用）の入力内容が等しくない（メッセージが表示される）
例としてはinput、form、table等で、こちらはWebサーバーコントロールとは異なり、タグとコントロールが１対１で対応しています。
簡潔に言うと、従来のHTMLタグに対し、サーバーコントロールとしての機能を付与しただけのものとなります。
基本的には、ASP.NETでは高機能なものを実装できる等の観点からWebサーバーコントロールを優先して採用するべきですが、既存のHTMLページがあって、それをASP.NET化させたい場合や、緻密にHTMLタグを操作したい場合などにこちらを検討することもあるので、覚えておいても損は無いでしょう。
ざっくり言うと、「開発者（ユーザー）がコントロールを組み合わせて独自に作成したコントロール」のことです。
より簡潔に説明すると、「Webページのヘッダー等の、いわゆる「テンプレート」となる部分を他のWebページでも使いまわしができるように部品化させたもの」になります。
Webフォームと同様に、各種サーバーコントロールを組み合わせて作成するため、「部品化したWebフォーム」と呼んでもいいでしょう。
Webサーバーコントロール
Webサーバーコントロールは、Webアプリケーションに必要な機能を提供するコントロールです。ラベルやテキストボックス、ボタンなど、基本的なものもありますが、カレンダーやグリッドビューなどの複雑な機能もあります。
また、HTMLサーバーコントロールとの違いとしては、コントロールとHTMLのタグが、必ずしも１対１に対応しているわけではないという点があります。
例として、カレンダー機能を挙げますが、この機能を提供するCalenderコントロールは配置すると「Table」タグと複数の「a」タグ（Tr,Td等）に変換されます。
このように、複数のタグの組み合わせにより高機能なコントロールを実装できるというのがWebサーバーコントロールの特徴であります。
中には、「検証コントロール」というものもあり、これはユーザーが入力した値に対して検証、つまりチェックを行うコントロールになります。
以下に挙げる例は、「CompareValidator」コントロールという、ユーザーが入力したデータを、もう一つのデータか定数と比較するコントロールですが、これ以外にも入力値が指定した書式になっているかというチェックを行うコントロールも用意されています。
これらは、やろうと思えばプログラムを書いて実装することは可能ですが、予めそういった機能を持つコントロールが実装されている分、開発を効率化できるという利点があります。
メールアドレスとメールアドレス（確認用）の入力内容が等しい
メールアドレスとメールアドレス（確認用）の入力内容が等しくない（メッセージが表示される）
HTMLサーバーコントロール
HTMLサーバーコントロールは、HTMLのタグをサーバーから操作するためのコントロールです。例としてはinput、form、table等で、こちらはWebサーバーコントロールとは異なり、タグとコントロールが１対１で対応しています。
簡潔に言うと、従来のHTMLタグに対し、サーバーコントロールとしての機能を付与しただけのものとなります。
基本的には、ASP.NETでは高機能なものを実装できる等の観点からWebサーバーコントロールを優先して採用するべきですが、既存のHTMLページがあって、それをASP.NET化させたい場合や、緻密にHTMLタグを操作したい場合などにこちらを検討することもあるので、覚えておいても損は無いでしょう。
ユーザーコントロール
ユーザーコントロールは、厳密には前述の２種とはカテゴリが異なるものです。ざっくり言うと、「開発者（ユーザー）がコントロールを組み合わせて独自に作成したコントロール」のことです。
より簡潔に説明すると、「Webページのヘッダー等の、いわゆる「テンプレート」となる部分を他のWebページでも使いまわしができるように部品化させたもの」になります。
Webフォームと同様に、各種サーバーコントロールを組み合わせて作成するため、「部品化したWebフォーム」と呼んでもいいでしょう。
2. サーバーコントロールの共通知識
Webフォームにサーバーコントロールを配置する際は、対応するタグを.aspxファイルに記述する必要があります。
書き方の具体例は以下になります。
（例）テキストボックスの場合
タグ名となる「asp:TextBox」がサーバーコントロール名になっていて、後はプロパティに対応しています。
プロパティとは、配置したサーバーコントロールの文字列の大きさ等の外観や、コントロールごとの挙動の設定情報のことです。
VisualStudioでは、ツールボックスからデザイン上にドラッグアンドドロップして、デザイン上にあるプロパティを設定するだけで大まかに出来上がってしまうので、とても利便性が高いです。
テキストボックスの場合
（画面左がデザイン、右が各プロパティになります）
プロパティについては、サーバーコントロールの種類によって色々なものがありますが、共通するものの多い基本となる部分を以下に記載します。
・ID
コントロールのID。
コントロールをプログラムで操作・参照する際の変数に用いられる。
・Visible
コントロールの表示/非表示を操作する。
ここで「非表示」にしている場合、実行時にブラウザに送られるHTMLにも入らなくなるので注意。
・Font
コントロールの文字列の設定。
（Fontの中にSize（文字サイズ）、Bold（文字を太くする）等がある）
・ForeColor
前景色（基本は文字色という認識でいい）
・BackColor
背景色
・Height
コントロールの高さ（縦幅）
・Width
コントロールの幅（横幅）
・Enabled
コントロールが有効化どうか（操作の可不可）
上記の中でも特に重要な位置を示すのが「ID」になります。
概要でも述べたように、各コントロールの「名前」となる部分で、他のコントロールが参照する際のキーであったり、プログラム中で変数として扱うものになります。
よって、１つのファイルの中で重複することは許されませんので、注意が必要です。
また、命名にはいくつかのルールがあるので、こちらも注意しましょう。
以下は、その一部です。
・アルファベット、もしくは「_」（アンダーライン）で始める。
（数字や「_」以外の記号で始めない）
OK：Flower、_Flower
NG：2Flower、!Flower
・２文字目以降は英数字もしくは「_」にする
（「_」以外の記号を使わない）
OK：Txt、Txt_1
NG：Txt!、Tテキスト
・予約語（If,While,Loop等）は使わない
（「Ifa」等、文字列内に入っている（文字列の一部）だけならいいが、単体ではNG）
・１文字でもいいが、「_」は１文字だけではいけない
OK：x、y
NG:_
・1023文字を超えない
（そんなに長文のIDを使うことはまずありませんが）
書き方の具体例は以下になります。
（例）テキストボックスの場合
タグ名となる「asp:TextBox」がサーバーコントロール名になっていて、後はプロパティに対応しています。
プロパティとは、配置したサーバーコントロールの文字列の大きさ等の外観や、コントロールごとの挙動の設定情報のことです。
VisualStudioでは、ツールボックスからデザイン上にドラッグアンドドロップして、デザイン上にあるプロパティを設定するだけで大まかに出来上がってしまうので、とても利便性が高いです。
テキストボックスの場合
（画面左がデザイン、右が各プロパティになります）
プロパティについては、サーバーコントロールの種類によって色々なものがありますが、共通するものの多い基本となる部分を以下に記載します。
・ID
コントロールのID。
コントロールをプログラムで操作・参照する際の変数に用いられる。
・Visible
コントロールの表示/非表示を操作する。
ここで「非表示」にしている場合、実行時にブラウザに送られるHTMLにも入らなくなるので注意。
・Font
コントロールの文字列の設定。
（Fontの中にSize（文字サイズ）、Bold（文字を太くする）等がある）
・ForeColor
前景色（基本は文字色という認識でいい）
・BackColor
背景色
・Height
コントロールの高さ（縦幅）
・Width
コントロールの幅（横幅）
・Enabled
コントロールが有効化どうか（操作の可不可）
上記の中でも特に重要な位置を示すのが「ID」になります。
概要でも述べたように、各コントロールの「名前」となる部分で、他のコントロールが参照する際のキーであったり、プログラム中で変数として扱うものになります。
よって、１つのファイルの中で重複することは許されませんので、注意が必要です。
また、命名にはいくつかのルールがあるので、こちらも注意しましょう。
以下は、その一部です。
・アルファベット、もしくは「_」（アンダーライン）で始める。
（数字や「_」以外の記号で始めない）
OK：Flower、_Flower
NG：2Flower、!Flower
・２文字目以降は英数字もしくは「_」にする
（「_」以外の記号を使わない）
OK：Txt、Txt_1
NG：Txt!、Tテキスト
・予約語（If,While,Loop等）は使わない
（「Ifa」等、文字列内に入っている（文字列の一部）だけならいいが、単体ではNG）
・１文字でもいいが、「_」は１文字だけではいけない
OK：x、y
NG:_
・1023文字を超えない
（そんなに長文のIDを使うことはまずありませんが）