使用MVC框架中要注意的问题:何时使用PartialView(部分类)方法

我们知道，作为Action的响应，最常见的做法是Return View()；也就是说，返回一个视图。但是如果我们某的操作只是要返回页面的一部分，典型的情况就是，在页面上实现局部的刷新功能。

实现局部刷新功能，以前我们是自己用javascript，解析json数据来实现的。下面有一个例子

Action里面的代码
/// <summary>
        /// 返回某个照片目前的评论消息
        /// </summary>
        /// <returns></returns>
        //[AcceptVerbs(HttpVerbs.Post)]
[Authorize]
public ActionResult Blog(string id)
{
    var blogs=new[]{
new {Title="评论标题",Details="我的评论",Author="张三",Time=DateTime.Now.Tostring()},
    new {Title="评论标题",Details="我的评论",Author="张三",Time=DateTime.Now.ToString()},
new {Title="评论标题",Details="我的评论",Author="张三",Time=DateTime.Now.Tostring()},
    new {Title="评论标题",Details="我的评论",Author="张三",Time=DateTime.Now.ToString()},
new {Title="评论标题",Details="我的评论",Author="张三",Time=DateTime.Now.Tostring()}},
return  Json(blogs,"text/json");

}

在页面中的JavaScript代码
$.ajax({
type: "POST",
url: action+key,
dataType: "json",
success:function(result){
$("#blog").empty();
var ol=$("<ol />");
$.each(result,function(i,n){
var  t=n.Title+",(" + n.Author +"),创建于："+ n.Time + "<div>" + n.Details + "</div>";
$("<li />").append(t).appendTo(ol);
});
ol.appendTo($("#blog"));
}
});

这样做确实可以实现我们的功能，但太过繁琐，而且因为要在js中拼接那些div，实在是很容易出错的
更好的做法，首先创建一个PartialView，就是一个UserControl
<%@  Control Language="C#" Inherits=System.Web.Mvc.ViewUserControl<IEnumerable<web.Models.BlogItem>>%>
<table>
        <tr>
            <th>
                Ttile
            </th>
            <th>
                Author
            </th>
            <th>
                Details
            </th>
            <th>
                Time
            </th>
        </tr>
    <% foreach (var item in Model) { %>
        <tr>
            <td>
                <%= Html.Encode(item.Title) %>
            </td>
            <td>
                <%= Html.Encode(item.Author) %>
            </td>
            <td>
                <%= Html.Encode(item.Details) %>
            </td>
            <td>
                <%= Html.Encode(item.Time) %>
            </td>
        </tr>    
    <% } %>
    </table>

然后，修改一下Action的代码
        /// <summary>
        /// 返回某个照片目前的评论消息
        /// </summary>
        /// <returns></returns>
        //[AcceptVerbs(HttpVerbs.Post)]
        [Authorize]
        public ActionResult Blog(string id)
        {
            var blogs = new Models.BlogItem[]
            {
            new Models.BlogItem(){Title="评论标题",Details="我的评论",Author="张三",Time=DateTime.Now},
            new Models.BlogItem(){Title="评论标题",Details="我的评论",Author="张三",Time=DateTime.Now},
            new Models.BlogItem(){Title="评论标题",Details="我的评论",Author="张三",Time=DateTime.Now},
            new Models.BlogItem(){Title="评论标题",Details="我的评论",Author="张三",Time=DateTime.Now},
            new Models.BlogItem(){Title="评论标题",Details="我的评论",Author="张三",Time=DateTime.Now}
            };

            return PartialView("BlogView", blogs);
        }

这样的话，js中就只要一句话了
            $("#blog").load(action + key);