第1回 ASP.NET MVCフレームワーク 基本のキ：連載：ASP.NET MVC入門（3/5 ページ）
［3］ビューを作成する
次に、アクションに対応するビューを作成しよう。Model−View−ControllerのViewである。
新規にビューを生成するには、コード・エディタ上でアクション・メソッドにカーソルを合わせた状態でマウスを右クリックし、表示されたコンテキスト・メニューから［Add View］を選択すればよい*8。
*8 ちなみに、すでにあるビューに画面を切り替えるには、コンテキスト・メニューから［Go To View］を選択すればよい。
［Add View］ダイアログが表示されるので、ここでは［View name］欄が「Index」（アクションと同名）になっていることを確認したうえで、［Add］ボタンをクリックする。ほかのオプションについては、ここでは取りあえず未チェックのままとしておこう。
図9 ［Add View］ダイアログ［Add］ボタンをクリックした後、ソリューション・エクスプローラから「/Views」フォルダの配下に「Hello/Index.aspx」が生成されていることを確認してほしい。このように、ASP.NET MVCではビュー（.aspxファイル）を「/Views」フォルダ配下に「コントローラ名/アクション名.aspx」のように配置する必要があるのだ。
コード・エディタ上でIndex.aspxが開くので、ここでは次のリスト2の要領でコードを追加しておこう。大部分のコードは自動生成されているので、自分で追加するのは太字の部分だけである。
<%@ Page Language="C#" Inherits="System.Web.Mvc.ViewPage" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title><%=Html.Encode(ViewData["msg"])%></title>
</head>
<body>
<div>
<%=Html.Encode(ViewData["msg"])%>
</div>
</body>
</html>
<%@ Page Language="VB" Inherits="System.Web.Mvc.ViewPage" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title><%=Html.Encode(ViewData("msg"))%></title>
</head>
<body>
<div>
<%=Html.Encode(ViewData("msg"))%>
</div>
</body>
</html>
（上：C#用、下：VB用）
ビューに動的な処理を埋め込むには、<%……%>、<%=……%>などのコード・ブロックを使用すればよい。ここでは、ViewDataプロパティを介して、先ほどアクション・メソッドの中で設定したmsgキーの値を取得しているわけだ。
なお、Html.EncodeメソッドはHTMLヘルパーの一種で、与えられた文字列をHTMLエンコードするための役割を提供するものだ。冒頭で述べたように、ASP.NET MVCではビューを記述するために従来のサーバ・コントロールを利用することはできないが、その分、HTMLヘルパーを利用することで、ビューの開発を効率化できる。
以下に、主なHTMLヘルパーをまとめておこう。それぞれの詳細については、今後、登場の都度に解説していくので、ここでは「こんなものがあるのか」という程度の感覚でご覧いただくだけで構わない。
| 分類 | メソッド | 概要 | |
|---|---|---|---|
| 基本 | Encode | 与えられた文字列をHTMLエンコード | |
| RenderPartial | 指定されたユーザー・コントロールを出力 | ||
| ActionLink | 指定されたアクションに対するリンク（<a>要素）を生成 | ||
| フォーム | BeginForm | フォーム（<form>要素）を生成 | |
| CheckBox | チェックボックスを生成 | ||
| DropDownList | ドロップダウンリストを生成 | ||
| Hidden | 隠しフィールドを生成 | ||
| ListBox | リストボックスを生成 | ||
| Password | パスワードボックスを生成 | ||
| RadioButton | ラジオボタンを生成 | ||
| TextArea | テキストエリアを生成 | ||
| TextBox | テキストボックスを生成 | ||
| 検証 | ValidationMessage | 検証エラー時に個々で表示すべきメッセージを表示 | |
| ValidationSummary | 検証結果をサマリしたものを表示 | ||
| 表2 ASP.NET MVCで使える主なHTMLヘルパー | |||
［4］サンプルを実行する
以上の手順を終えたら、サンプルを実行してみよう。デバッグ実行でブラウザを起動し、以下のようなアドレスを入力してほしい（ポート番号は環境によって異なる）。
http://localhost:4419/Hello/Index
このようにHelloコントローラのIndexアクションを呼び出すには、「/Hello/Index」のようなアドレスとなるわけだ。ちなみに、デフォルトの設定ではIndexアクションの指定は省略可能なので、この場合には、
http://localhost:4419/Hello
でも同様の結果が得られる。
■ルーティングの設定を理解する
最初のサンプル・アプリケーションを動作確認できたところで、ASP.NET MVCの理解には欠かせないルーティングについて解説しておこう。
前述したように、ルーティングとは、リクエストURIに応じて処理の受け渡し先を決定することをいう。ASP.NET MVCでは、あらかじめGlobal.asaxで決められたルーティング・ルールに基づいて、ルーティングを行っている。Global.asaxで、実際にルーティング・ルールを定義しているのは以下のコードだ。
public static void RegisterRoutes(RouteCollection routes) {
……中略……
routes.MapRoute(
"Default",
"{controller}/{action}/{id}",
new { controller = "Home", action = "Index", id = "" }
);
}
protected void Application_Start() {
RegisterRoutes(RouteTable.Routes);
}
Shared Sub RegisterRoutes(ByVal routes As RouteCollection)
……中略……
routes.MapRoute( _
"Default", _
"{controller}/{action}/{id}", _
New With { .controller = "Home", _
.action = "Index", .id = ""} _
)
End Sub
Sub Application_Start()
RegisterRoutes(RouteTable.Routes)
End Sub
（上：Global.asax.cs、下：Global.asax.vb）
RegisterRoutesメソッドはアプリケーション起動（Startイベント・ハンドラ）のタイミングで呼び出されるメソッドで、ルーティング・ルールの追加を行っている。
ルーティング・ルールを追加するには、ルールの集合を表すRouteCollectionオブジェクトからMapRouteメソッドを呼び出すだけだ。MapRouteメソッドの構文は、次のとおり。
MapRoute(ByVal name As String, ByVal url As String, ByVal defaults As Object)
' name：ルール名、url：ルーティング方式、defaults：初期値
引数urlは、ルーティングの際に実際にマッチングを行うURIパターンを表すものだ。ここでは、
{controller}/{action}/{id}
がそれである。「{名前}」の部分は変数のプレイスホルダで、{controller}はコントローラ名、{action}はアクション名を、それぞれ表す。{id}についてはあらためて後述するが、アクション・メソッドに引き渡される任意のパラメータ（ユーザー・パラメータ）を表すものだ。
パラメータ名もデフォルトでは{id}となっているが、特に決まりはないので自由に変更しても構わないし、以下のように複数のユーザー・パラメータを定義することもできる。
{controller}/{action}/{category}/{id}
これら変数のデフォルト値を指定しているのが、引数defaultsの部分だ。ここでは、
new { controller = "Home", action = "Index", id = "" }
New With {.controller = "Home", .action = "Index", .id = ""}
としているので、コントローラ名のデフォルト値は「Home」、アクション名のデフォルト値は「Index」、idパラメータのデフォルト値は空文字列であると見なされる。
つまり、この設定では「http://localhost:4419/」を呼び出した場合、HomeコントローラのIndexアクションが呼び出されることになる。先ほど「http://localhost:4419/Hello/」でHello/Indexアクションが呼び出せたのも、ここでアクション名のデフォルト値がIndexとなっていたからだ。
［注意］省略可能なアクション
ちなみに、省略できるのは後方にパラメータの指定がない場合に限られる。例えば、コントローラ名だけを省略したつもりで「http://localhost:4419/Index」としても、これは「http://localhost:4419/Home/Index」ではなく、「http://localhost:4419/Index/Index」と見なされる。
Copyright© Digital Advantage Corp. All Rights Reserved.
注目のテーマ
ITmediaはアイティメディア株式会社の登録商標です。