Html.Partial與Html.RenderPartial使用方式

在MVC應用中，我們可以使用一些Html Helper來幫助我們建立一些小小可重複使用的Partial View(如Form表單、項目列表或是連結)，執行後，可內嵌在主要的View之中，本文介紹Html.Partial與Html.RenderPartial的基本運作與使用方式。

這兩個Html Helper屬於System.Web.Mvc.Html.PartialExtensions類別下的方法之一，使用方式都是將PartialView名稱，Model或ViewData當作參數帶入這些Html Helper，而這個當作參數帶入的PartialView名稱，通常就是我們可以先製作成為User Control View (*.ascx)，另外，亦可進一步將Model或者是ViewData帶入這個預先製作好的User Control View 中，這個User Control View可放入與主要View的相同目錄中，也可以放入到View/Shared/這個公用的View目錄中。

Html.Partial

這裡我們要產生一個類似「Navigation Bar(網頁導覽連結)」的功能在一個主要的View上面，我們首先在主要的View上在要顯示這個Bar的地方標示如下，表示我們要取用的內容在名稱為NavigateBarUserControl.ascx的這個User control View。請注意，因為Html.Partial的回應示字串型態的Html碼，故須加上Encode的「<%:」符號。

<%: Html.Partial("NavigateBarUserControl") %>

NavigateBarUserControl.ascx的程式內容如下：

<%@ Control Language="C#"
Inherits="System.Web.Mvc.ViewUserControl" %>
<span style="color:Green;">Home > DemoPage > Product</span>

這個範例執行後，產生的整個主要的View如下圖所示，紅框部分為我們使用Html.Partial所產生的網頁導覽連結。這樣的方式，使得相同的網頁導覽連結這個功能可以在不用重寫程式的狀況下，讓在網站的不同地方被使用。

另外，若要帶入Model(假設是NavigateViewModel)當作是參數到Html.Partial中，可採下列方式寫法：

<%: Html.Partial("NavigateBarUserControl",Model) %>

當然NavigateBarUserControl.ascx中也要註明是要去接Model(假設是NavigateViewModel) 這個參數。

<%@ Control Language="C#"
Inherits="System.Web.Mvc.ViewUserControl<Mvc2Application.Models.NavigateViewModel>" %>
<% foreach (var item in Model) {%>
    :
    :

已上為Html.Partial的用法。

Html.RenderPartial

這裡的範例，是想要呈現「登入使用者的角色」到主要的View網頁上，我們順道示範如何將ViewData也帶入到Html.RenderPartial之中，我們要呈現的PartialView是一個名稱為RolesUserControl.ascx的User control View，為了簡化範例我們令ViewData等於一個Admin的角色名稱。

<% Html.RenderPartial("RolesUserControl", ViewData["Role"] = "Admin"); %>

RolesUserControl.ascx的程式內容如下，ViewData的名稱須與上述帶入的ViewData參數同名：

<%@ Control Language="C#"Inherits="System.Web.Mvc.ViewUserControl" %>
<span>Role:<%:ViewData["Role"] %></span>

執行這個範例後，如下圖會在主要的View頁面上顯示這個PartialView，當然一般這個網頁導覽連結會設定在MVC應用中的Site.Master這支View之中。

上面即是Html.Partial與Html.RenderPartial的範例說明，陸續我們會介紹Html.Action與Html.RenderAction使用方式，與本文相關的連結如下：

Html.Action、Html.Partial、Html.RenderAction與Html.RenderPartial的基本運作與介紹