ビューの一部を再利用可能にする(部分ビュー)

ビューの一部を再利用可能にする(部分ビュー)


部分ビューとは部分的(断片的)なビューのこと。
複数のページで共通で利用するような領域がある場合は、部分ビューを利用すれば
個別ビューで同じコードを記述する必要がなくなる。
 
レイアウトがヘッダーやフッターのような外枠を定義するのに対し、部分ビューは断片的な共通部品を定義する。

【部分ビューの基本】

以下はメンバー情報の作成・編集画面を部分ビュー化する例。

①部分ビューを作成する

Views\Sharedフォルダーを右クリック→追加→ビュー
※複数のコントローラーで共有する為にSharedフォルダーに作成している
 特定のコントローラーのみで使用する場合、コントローラーのフォルダ配下に部分ビューを作成する。
29
部分ビューとして作成にチェックします。
追加を押下すると、部分ビューが作成される。(_MemberPartial.vbhtml)
自動作成した部分ビューに対して複数のページで共通利用できるように編集する。
 

②部分ビューを利用する

個別ビューから部分ビューと重複している部分を削除し、部分ビューを呼び出す。
部分ビューを呼び出すには、@Html.Partialメソッドを使用する。
@Html.Partial(部分ビュー名, モデル)
(※呼び出し元のモデルを部分ビューにも引き継ぐ場合、引数のモデルは省略可)
[ビュー(Views\Members\Create.vbhtml)]

 
[ビュー(Views\Members\Edit.vbhtml)]

 

【RenderPartialメソッド(応答ストリームに直接出力)】

Partialメソッドの代わりにRenderPartialメソッドを利用する子ともできる。
 
部分ビューを出力するという点では同じだが、戻り値が異なる。
Partialメソッドの戻り値はMvcHtmlString型であるが、RenderPartialメソッドはSubプロシージャのため
戻り値がない。応答ストリームに対して直接出力する。
そのため@Code~End Codeの中にRenderPartialメソッド記載する必要がある。

[ビュー(Views\Members\Create.vbhtml)]

 

【Action/RenderActionメソッド(アクションを呼び出す)】

@Html.Actionメソッドを使用することにより、ビューからアクションを呼び出し、その結果を部分ビューで描画
できる。
部分ビューに何かしらデータを渡してやる場合に利用する。
以下は個別ビューから@Html.Actionメソッドを使用して子アクションを呼び出し、その子アクションから
PartialViewメソッドを使用して部分ビューを呼び出し、個別ビューに反映させる例

①子アクションを準備

@Html.Actionメソッドから呼び出す子アクション(CurrentTime)を準備する。
子アクションは通常のアクション同様任意のコントローラーに追加できる。
[Controllers\ItemController.vb]

・ChildActionOnly属性
 そのアクションが@Html.Actionメソッド経由でのみ呼び出されることを指定する属性。
 この属性がないとアクションはHTTP経由で直接呼び出せてしまい都合が悪い。

・PartialViewメソッド
 子アクションから部分ビューを呼び出す場合、PartialViewメソッドを使用する。
  PartialView(部分ビュー名, モデル)
 (上記の例だとモデルにDateTime.Nowを渡している)
 Viewメソッドでもエラーにはならないが、部分ビューに_ViewStart.vbhtml内で設定した
 レイアウトが適用されてしまい都合が悪い。
 

②部分ビューを準備

CurrentTimeアクションから呼び出される部分ビューは以下の通り。
[Views\Shared\_CurrTimePartial.vbhtml]

子アクション側のPartialViewで指定したモデルがDateTime型のため@ModelTypeでDateTimeを指定している。
 

③子アクションを呼び出す

メインの個別ビューから@Html.Actionを使用して、子アクションを呼び出します。
 
 @Html.Action(アクション名, コントローラー名)
 引数であるコントローラー名は省略可能で、省略した場合現在のコントローラーに対してアクションを検索する。 

arrow_down
[出力結果(HTML)]

 
ちなみにActionメソッドの代わりにRenderActionメソッドも利用できる。
Actionメソッドは部分ビューによる出力を文字列(MvcHtmlString型)で返すのに対し、
RenderActionメソッドは応答ストリームに出力する。