ASP.NET MVC中使用PartialView方法

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

 

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

 

action里面的代码

 

[csharp]  

/// <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代码

 

[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 + "<p>" + n.details + "</p>";  

                     $("<li />").append(t).appendto(ol);  

                 });  

  

                 ol.appendto($("#blog"));  

             }  

         });  

 

这样做确实可以实现我们的功能，但太过繁琐，而且因为要在js中拼接那些p，实在是很容易出错的。

 

 

 

更好的做法是，首先创建一个partialview，其实就是一个usercontrol

 

[html]  

<%@ control language="c#" inherits="system.web.m.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的代码

[csharp]  

/// <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中就只要一句话了

 

[html]  

$("#blog").load(action + key);