MVC |分部视图 PartialView()

介绍如何定义

其实它和普通视图没有多大区别，只是创建分部视图的时候视图里没有任何内容，你需要什么标签你自己加。第二就是分部视图不会执行_ViewStart.cshtml中的内容）

控制器

PartialViewDeomController控制器

 

[csharp] view plain copy
 
  1. using System;  
  2. using System.Collections.Generic;  
  3. using System.Linq;  
  4. using System.Web;  
  5. using System.Web.Mvc;  
  6.   
  7. namespace MvcApp.Controllers  
  8. {  
  9.     public class PartialViewDeomController : Controller  
  10.     {  
  11.         //  
  12.         // 分部视图的作用一般用于嵌到如一些正常的视图中去。（类似与自定义控件）相当于： Server.Execute(string path)  
  13.   
  14.         public ActionResult PartialIndex()  
  15.         {  
  16.             //View()方法返回的视图默认都会去执行_ViewStart.cshtml中的内容  
  17.             //return View();  
  18.   
  19.             //分部视图不会去执行_ViewStart.cshtml中的内容（分部视图以PartialView()返回）  
  20.             return PartialView();  
  21.         }  
  22.     }  
  23. }  


PartialIndex 视图

 

 

[html] view plain copy
 
  1. <!--注意，创建分部视图后，视图里是没有任何东西的。自己需要什么标签，就加什么标签。这个视图的用法就是到时候嵌套到一些以View()返回的正常视图中去-->  
  2.   
  3. <select id="dp1">  
  4.     <option value="0">湖南</option>  
  5.     <option value="1">广东</option>  
  6.     <option value="0">上海</option>>  
  7. </select>  
  8.   
  9. <select id="dp2">  
  10.     <option value="0">纽约</option>  
  11.     <option value="1">洛杉矶</option>  
  12.     <option value="0">华盛顿</option>>  
  13. </select>  


 

使用介绍（我们发现它与普通视图是差不多的）

PartialViewDeomController控制器

 

[csharp] view plain copy
 
  1. using System;  
  2. using System.Collections.Generic;  
  3. using System.Linq;  
  4. using System.Web;  
  5. using System.Web.Mvc;  
  6.   
  7. namespace MvcApp.Controllers  
  8. {  
  9.     using MvcApp.Models;  
  10.     public class PartialViewDeomController : Controller  
  11.     {  
  12.         //  
  13.         // 分部视图的作用一般用于嵌到如一些正常的视图中去。（类似与自定义控件）相当于： Server.Execute(string path)  
  14.   
  15.         public ActionResult PartialIndex()  
  16.         {  
  17.   
  18.             var list = new List<T_UserInfo>()  
  19.             {  
  20.                 new T_UserInfo(){Id=1,UserName="无盐海",Name="凡斌"},  
  21.                 new T_UserInfo(){Id=1,UserName="阿宝",Name="周晶"},                           
  22.             };  
  23.   
  24.             //分部视图不会去执行_ViewStart.cshtml中的内容（分部视图以PartialView()返回）  
  25.             return PartialView(list);  
  26.         }  
  27.     }  
  28. }  


PartialIndex视图

 

 

[html] view plain copy
 
  1. @model List<MvcApp.Models.T_UserInfo>  
  2.   
  3. <select id="dp1">  
  4.     @{  
  5.         foreach (var item in Model)   
  6.         {   
  7.              <option value="0">@item.Name</option>  
  8.         }  
  9.     }  
  10. </select>  

 

 

真实的使用介绍 （重点）

 

PartialViewDeomController控制器

 

[csharp] view plain copy
 
  1. using System;  
  2. using System.Collections.Generic;  
  3. using System.Linq;  
  4. using System.Web;  
  5. using System.Web.Mvc;  
  6.   
  7. namespace MvcApp.Controllers  
  8. {  
  9.     using MvcApp.Models;  
  10.     public class PartialViewDeomController : Controller  
  11.     {  
  12.         public ActionResult Index()  
  13.         {  
  14.             return View();  
  15.         }  
  16.           
  17.         // 分部视图的作用一般用于嵌到如一些正常的视图中去。（类似与自定义控件）相当于： Server.Execute(string path)  
  18.   
  19.         public ActionResult PartialIndex()  
  20.         {  
  21.   
  22.             var list = new List<T_UserInfo>()  
  23.             {  
  24.                 new T_UserInfo(){Id=1,UserName="无盐海",Name="凡斌"},  
  25.                 new T_UserInfo(){Id=1,UserName="阿宝",Name="黄雪辉"},                           
  26.             };  
  27.   
  28.             //分部视图不会去执行_ViewStart.cshtml中的内容（分部视图以PartialView()返回）  
  29.             return PartialView(list);  
  30.         }  
  31.     }  
  32. }  


Index视图与PartialIndex分部视图。（注意：这里是在Index视图里调用PartialIndex分部视图）

 

 

[html] view plain copy
 
  1. @{  
  2.     Layout = null;  
  3. }  
  4. @using MvcApp.Models;  
  5. <!DOCTYPE html>  
  6.   
  7. <html>  
  8. <head>  
  9.     <meta name="viewport" content="width=device-width" />  
  10.     <title>Index</title>  
  11.     <script src="~/Scripts/jquery-1.8.2.js"></script>  
  12. </head>  
  13. <body>  
  14.     <div id="loadData"></div>  
  15.   
  16.     <div>  
  17.         <!--第一种方式：同一控制起下调用分部视图-->  
  18.         @Html.Partial("PartialIndex", new List<T_UserInfo>() { new T_UserInfo() { Id = 1, UserName = "无盐海", Name = "凡斌" }, new T_UserInfo() { Id = 1, UserName = "阿宝", Name = "周晶" }, })  
  19.   
  20.         <!--第二种方式：同一控制起下调用分部视图-->  
  21.         @{  
  22.             Html.RenderPartial("PartialIndex", new List<T_UserInfo>() { new T_UserInfo() { Id = 1, UserName = "无盐海", Name = "凡斌" }, new T_UserInfo() { Id = 1, UserName = "阿宝", Name = "周晶" } });  
  23.         }  
  24.   
  25.         <!--第三种方式：可以跨控制器调用分部视图（注意：如果通过这种方式调用分部视图，如果在再PartialIndex这个action中有传参给分部视图，则在此处调用就不需要再传递参数了）-->  
  26.         @{Html.RenderAction("PartialIndex", "PartialViewDeom");}  
  27.   
  28.         <!--第四种方式：也是可以跨控制器调用分部视图。和第三种是一样的-->  
  29.         @Html.Action("PartialIndex", new { controller = "PartialViewDeom" })  
  30.   
  31.         <!--第五种方式：用ajax来调用：如：jquery的Load()方法-->  
  32.         <script type="text/javascript">  
  33.             $(function () {  
  34.                 $("#loadData").load("/PartialViewDeom/PartialIndex"); //将PartialIndex分部视图中的内容加载到id为loadData这个元素中去  
  35.             })  
  36.         </script>  
  37.     </div>action  
  38. </body>  
  39. </html>  

posted @ 2017-12-25 15:41  ~雨落忧伤~  阅读(181)  评论(0)  编辑  收藏  举报