ASP.NET MVC3調用PartialView的幾種方式

我們的網頁通常會有好幾個部分組成，一些公用的地區我們通常會做成PartialView(部分視圖)，但這些視圖並不是完全固定的，所以還是需要 特定的Controller來控制。如果只是靜態html，雖然也可以做成PartialView，但意義不大。下面示範一下MVC3中如何調用 PartialView。

首先我們建立一個測試用的Controller：

TestController

public class TestController : Controller{    public ActionResult Message()    {        var testObj = new List<string>()        {            "aaa", "bbb", "ccc"        };         return PartialView("Message", testObj);    }}

裡面就一個Action方法，Message()，返回的是一個名為“Message”的PartialView，並且把一管字串作為參數傳給了這個View。

通常，我們建立了Controller後，會點右鍵，添加一個View。VS會預設在Views檔案夾裡建立對應的view檔案，這個例子裡本應該 是“Test/Message.cshtml”。但對於partialView，我們不這樣做。因為它是一個可重用的View，所以應該放到Shared 檔案夾下。MVC是“約定先行”的編程，所以預設會去找Shared檔案夾下的View以及當前頁面所在Controller下的View。

所以我們得在Shared檔案夾上點右鍵，添加一個View，並且選擇“Create as a Partial View”，這樣就不會添加layout等代碼，是個完全空白的view。

 

然後，我們要根據Action的傳回型別，做一些html的工作。這裡是簡單輸出了List<string>中的每個字串。

Message.cshtml

@model List<string> <ul>@foreach (var item in Model){    <li>@item</li>}</ul>

最後，我們在別的視圖裡就可以調用這個PartialView了。

一種方法是指定Controller和Action：

<h3>Call Html.Action</h3>@Html.Action("Message", "Test")

但Controller和Action不是必須的，你也可以建立一個對象傳給PartialView:

<h3>Call Html.Partial</h3>@Html.Partial("Message", new List<string> { "ccc", "ddd", "eee" })

還有一種比較常見的情況就是指令碼請求，下面的代碼就是通過JQuery去調用Test/Message，並把結果填充到ID為fuck的DIV中：

<h3>Use JQuery</h3><a href="javascript:;" onclick="loadFuck()">Invoke LoadPartial</a><div id="fuck">     </div> <script type="text/javascript">    function loadFuck() {        $("#fuck").load('/Test/Message');    }</script>

有圖有真相: