有多种方式可以将数据传递到视图，如下所示：

  • ViewData
  • ViewBag
  • PartialView
  • TempData
  • ViewModel
  • Tuple

场景：

在视图页面，下拉框选择课程触发事件，分别显示老师课程表、学生上课表，如图：

相关的Model：

     public class Course

     {

         public int Id { get; set; }

         public string Name { get; set; }

     }

     public class Teacher

     {

         public int Id { get; set; }

         public string Name { get; set; }

         public List<Course> Courses { get; set; }

     }

     public class Student

     {

         public int Id { get; set; }

         public string Name { get; set; }

         public List<Course> Courses { get; set; }

     }

 一、使用ViewData传递多个Model

□ HomeController

         public ActionResult Index()

         {

             ViewData["Courses"] = _repository.GetCourses();

             ViewData["Students"] = _repository.GetStudents();

             ViewData["Teachers"] = _repository.GetTeachers();

             return View();

         }

□ Home/Index.cshtml

 @using MvcApplication1.Models

 @using System.Web.Helpers;

 @{

     Layout = null;

 }

 <!DOCTYPE html>

 <html>

 <head>

     <meta name="viewport" content="width=device-width" />

     <title>ViewDataDemo</title>

     <script src="~/Scripts/jquery-1.8.2.js"></script>

     <script type="text/javascript">

         $(function () {

             //隐藏

             $('#students').hide();

             $('#teachers').hide();

             //点击课程下拉框

             $('#sel').change(function() {

                 selectedCourseName = $('#sel').val().trim();

                 if (selectedCourseName == "--选择课程--") {

                     $('#students').hide();

                     $('#teachers').hide();

                 } else {

                     getTeacherTable();

                     getStudentTable();

                     $('#students').show();

                     $('#teachers').show();

                 }

             });

         });

         var selectedCourseName;

         //创建老师课程表

         function getTeacherTable() {

             $('#teachersTable').empty();

             $('#teachersTable').append("<table id='tblTeachers'><tr><th>编号</th><th>姓名</th></tr></table>");

             //把所有老师转换成json格式

             var teachers = @Html.Raw(Json.Encode(ViewData["Teachers"]));

             for (var i = 0; i < teachers.length; i++) {

                 var courses = teachers[i].Courses;

                 for (var j = 0; j < courses.length; j++) {

                     if (courses[j].Name == selectedCourseName) {

                         $('#tblTeachers').append("<tr><td>"+courses[i].Id+"</td><td>"+courses[i].Name+"</td></tr>");

                     }

                 }

             }

         }

         //创建学生上课表

         function getStudentTable() {

             $('#studentsTable').empty();

             $('#studentsTable').append("<table id='tblStudents'><tr><th>编号</th><th>姓名</th></tr></table>");

             var students = @Html.Raw(Json.Encode(ViewData["Students"]));

             for (var i = 0; i < students.length; i++) {

                 var courses = students[i].Courses;

                 for (var j = 0; j < courses.length; j++) {

                     if (courses[j].Name == selectedCourseName) {

                         $('#tblStudents').append("<tr><td>"+courses[j].Id+"</td><td>"+courses[j].Name+"</td></tr>");

                     }

                 }

             }

         }

     </script>

 </head>

 <body>

     <div>

         <table>

             <tr>

                 <td><h3>选择课程</h3></td>

                 <td>

                     <select id="sel">

                         <option>--选择课程--</option>

                         @foreach (var course in ViewData["Courses"] as List<Course>)

                         {

                             <option>@course.Name</option>

                         }

                     </select>

                 </td>

             </tr>

         </table>

     </div>

     <div id="teachers">

         <h4>老师课程表</h4>

         <div id="teachersTable"></div>

     </div>

     <div id="students">

         <h4>学生上课表</h4>

         <div id="studentsTable"></div>

     </div>

 </body>

 </html>

@Html.Raw(Json.Encode(ViewData["Students"]))是把Model转换成json字符串，需要用到System.Web.Helpers，把此类库引用到项目，并且必须设置"复制到本地属性"为true,否则报错。

二、使用ViewBag传递多个Model

□ HomeController

 public ActionResult ViewBagDemo()

 {

     ViewBag.Courses = _repository.GetCourses();

     ViewBag.Students = _repository.GetStudents();

     ViewBag.Teachers = _repository.GetTeachers();

     return View();

 }

□ Home/ViewBagDemo.cshtml

下拉框遍历课程改成：
@foreach (var course in ViewBag.Courses)

getTeacherTable()方法中改成：
var teachers = @Html.Raw(Json.Encode(ViewBag.Teachers));

getStudentTable()方法中改成：
var students = @Html.Raw(Json.Encode(ViewBag.Students));

三、使用部分视图传递多个Model

□ HomeController

 public ActionResult PartialViewDemo()

 {

     List<Course> courses = _repository.GetCourses();

     return View(courses);

 }

 public ActionResult StudentsToPVDemo(string courseName)

 {

     IEnumerable<Course> courses = _repository.GetCourses();

     var selectedCourseId = (from c in courses

                             where c.Name == courseName

                             select c.Id).FirstOrDefault();

     IEnumerable<Student> students = _repository.GetStudents();

     var studentsInCourse = students.Where(s => s.Courses.Any(c => c.Id == selectedCourseId)).ToList();

     return PartialView("StudentPV", studentsInCourse);

 }

 public ActionResult TeachersToPVDemo(string courseName)

 {

     IEnumerable<Course> courses = _repository.GetCourses();

     var selectedCourseId = (from c in courses

                             where c.Name == courseName

                             select c.Id).FirstOrDefault();

     IEnumerable<Teacher> teachers = _repository.GetTeachers();

     var teachersForCourse = teachers.Where(t => t.Courses.Any(c => c.Id == selectedCourseId)).ToList();

     return PartialView("TeacherPV", teachersForCourse);

 }

□ Home/PartialViewDemo.cshmtl

 @model IEnumerable<MvcApplication1.Models.Course>

 @{

     Layout = null;

 }

 <!DOCTYPE html>

 <html>

 <head>

     <meta name="viewport" content="width=device-width" />

     <title>PatialViewDemo</title>

     <script src="~/Scripts/jquery-1.8.2.js"></script>

     <script type="text/javascript">

         $(function () {

             //隐藏

             $('#students').hide();

             $('#teachers').hide();

             //点击课程下拉框

             $('#sel').change(function() {

                 selectedCourseName = $('#sel').val().trim();

                 if (selectedCourseName == "--选择课程--") {

                     $('#students').hide();

                     $('#teachers').hide();

                 } else {

                     getTeacherTable();

                     getStudentTable();

                     $('#students').show();

                     $('#teachers').show();

                 }

             });

         });

         var selectedCourseName;

         //创建老师课程表

         function getTeacherTable() {

             $.ajax({

                 url: "@Url.Action("TeachersToPVDemo","Home")",

                 type: 'Get',

                 data: { courseName: selectedCourseName },

                 success: function(data) {

                     $('#teachersTable').empty().append(data);

                 },

                 error: function() {

                     alert("sth wrong");

                 }

             });

         }

         //创建学生上课表

         function getStudentTable() {

             $.ajax({

                 url: "@Url.Action("StudentsToPVDemo","Home")",

                 type: 'Get',

                 data: { courseName: selectedCourseName },

                 success: function (data) {

                     $('#studentsTable').empty().append(data);

                 },

                 error: function () {

                     alert("sth wrong");

                 }

             });

         }

     </script>

 </head>

 <body>

     <div>

         <table>

             <tr>

                 <td><h3>选择课程</h3></td>

                 <td>

                     <select id="sel">

                         <option>--选择课程--</option>

                         @foreach (var course in Model)

                         {

                             <option>@course.Name</option

                         }

                     </select>

                 </td>

             </tr>

         </table>

     </div>

     <div id="teachers">

         <h4>老师课程表</h4>

         <div id="teachersTable"></div>

     </div>

     <div id="students">

         <h4>学生上课表</h4>

         <div id="studentsTable"></div>

     </div>

 </body>

 </html>

□ TeacherPV.cshtml与StudentPV.cshtml

 @model IEnumerable<MvcApplication1.Models.Teacher>

 <table id="tblTeacherDetail">

     <tr>

         <th>编号</th>

         <th>名称</th>

     </tr>

     @foreach (var item in Model)

     {

         <tr>

             <td>@item.Id</td>

             <td>@item.Name</td>

         </tr>

     }

 </table>

四、使用TempData传递多个Model

□ HomeController

 public ActionResult TempDataDemo()

 {

     //第一次从数据库读取数据放到TempData中，以后的请求从TempData中获取数据

     TempData["Courses"] = _repository.GetCourses();

     //让TempData保存数据，直到下一次请求

     TempData.Keep("Courses");

     return View();

 }

 public ActionResult TeachersTempData(string courseName)

 {

     var courses = TempData["Courses"] as IEnumerable<Course>;

     //由于TempData["Courses"]还要被下一次请求，继续TempData保存数据

     TempData.Keep("Courses");

     var selectedCourseId = (from c in courses

         where c.Name == courseName

         select c.Id).FirstOrDefault();

     IEnumerable<Teacher> teachers = _repository.GetTeachers();

     var teachersForCourse = teachers.Where(t => t.Courses.Any(c => c.Id == selectedCourseId)).ToList();

     return PartialView("TeacherPV", teachersForCourse);

 }

 public ActionResult StudentsTempData(string courseName)

 {

     var courses = TempData["Courses"] as IEnumerable<Course>;

     //由于TempData["Courses"]还要被下一次请求，继续TempData保存数据

     TempData.Keep("Courses");

     var selectedCourseId = (from c in courses

                             where c.Name == courseName

                             select c.Id).FirstOrDefault();

     IEnumerable<Student> students = _repository.GetStudents();

     var studentsForCourse = students.Where(s => s.Courses.Any(c => c.Id == selectedCourseId)).ToList();

     return PartialView("StudentPV", studentsForCourse);

 }

□ Home/TempDataDemo.cshtml

下拉框遍历课程：
@foreach (var course in Model)

ajax请求老师课程表：
@Url.Action("TeachersTempData","Home")

ajax请求学生上课表：
@Url.Action("StudentsTempData","Home")

五、使用ViewModel传递多个Model

□ View Model

 public class SchoolVm

 {

     public List<Course> Courses { get; set; }

     public List<Student> Students { get; set; }

     public List<Teacher> Teachers { get; set; }

 }

□ HomeController

 public ActionResult ViewModelDemoVM()

 {

     SchoolVm vm = new SchoolVm();

     vm.Courses = _repository.GetCourses();

     vm.Teachers = _repository.GetTeachers();

     vm.Students = _repository.GetStudents();

     return View(vm);

 }

□ Home/ViewModelDemoVM.cshtml

@model MvcApplication1.Models.SchoolVm

下拉框遍历课程：
@foreach (var course in Model.Courses)

ajax请求老师课程表和学生上课表：
@Html.Raw(Json.Encode(Model.Teachers))
@Html.Raw(Json.Encode(Model.Students))

六、使用Tuple传递多个Model

□ HomeController

 public ActionResult TupleDemo()

 {

     var allModels = new Tuple<List<Course>, List<Teacher>, List<Student>>(_repository.GetCourses(),

         _repository.GetTeachers(), _repository.GetStudents()) {};

     return View(allModels);

 }

□ Home/TupleDemo.cshtml

@model Tuple <List <MvcApplication1.Models.Course>, List <MvcApplication1.Models.Teacher>, List <MvcApplication1.Models.Student>>

下拉框遍历课程：
@foreach (var course in Model.Item1)

ajax请求老师课程表和学生上课表：
@Html.Raw(Json.Encode(Model.Item2))
@Html.Raw(Json.Encode(Model.Item3))

参考链接：https://www.codeproject.com/Articles/687061/Using-Multiple-Models-in-a-View-in-ASP-NET-MVC-M

ASP.NET MVC传递Model到视图的多种方式总结（一）__通用方式的使用的更多相关文章

  1. ASP.NET MVC传递Model到视图的多种方式总结

    ASP.NET MVC传递Model到视图的多种方式总结 有多种方式可以将数据传递到视图,如下所示: ViewData ViewBag PartialView TempData ViewModel T ...

  2. ASP.NET MVC传递Model到视图的多种方式之通用方式的使用

    ASP.NET MVC传递Model到视图的多种方式总结——通用方式的使用 有多种方式可以将数据传递到视图,如下所示: ViewData ViewBag PartialView TempData Vi ...

  3. ASP.NET MVC传递Model到视图的多种方式总结（二）__关于ViewBag、ViewData和TempData的实现机制与区别

    在ASP.NET MVC中,视图数据可以通过ViewBag.ViewData.TempData来访问,其中ViewBag 是动态类型(Dynamic),ViewData 是一个字典型的(Diction ...

  4. ASP.NET MVC 3 Model【通过一简单实例一步一步的介绍】

    今天主要讲Model的两个方面: 1. ASP.Net MVC 3 Model 简介 通过一简单的事例一步一步的介绍 2. ASP.Net MVC 3 Model 的一些验证 MVC 中 Model ...

  5. ASP.NET MVC 之Model的呈现

    ASP.NET MVC 之Model的呈现(仅此一文系列三) 本文目的 我们来看一个小例子,在一个ASP.NET MVC项目中创建一个控制器Home,只有一个Index: public class H ...

  6. Asp.net MVC的Model Binder工作流程以及扩展方法(2) - Binder Attribute

    上篇文章中分析了Custom Binder的弊端: 由于Custom Binder是和具体的类型相关,比如指定类型A由我们的Custom Binder解析,那么导致系统运行中的所有Action的访问参 ...

  7. Asp.net MVC的Model Binder工作流程以及扩展方法(1) - Custom Model Binder

    在Asp.net MVC中, Model Binder是生命周期中的一个非常重要的部分.搞清楚Model Binder的流程,能够帮助理解Model Binder的背后发生了什么.同时该系列文章会列举 ...

  8. [转]ASP.NET MVC 2: Model Validation

    本文转自:http://weblogs.asp.net/scottgu/archive/2010/01/15/asp-net-mvc-2-model-validation.aspx?CommentPo ...

  9. Asp.net MVC的Model Binder工作流程以及扩展方法(1)

    Asp.net MVC的Model Binder工作流程以及扩展方法(1)2014-03-19 08:02 by JustRun, 523 阅读, 4 评论, 收藏, 编辑 在Asp.net MVC中 ...

随机推荐

  1. iOS推送功能极光推送的介绍与实现

    1.个人整理操作流程 2.官方使用说明流程 2018iOS极光推送完整流程 极光推送官网

  2. webstorm keymap

    http://www.jetbrains.com/webstorm/documentation/WebStorm_ReferenceCard.pdf

  3. kali Linux 上编译并使用RFID核弹——proxmark3

    你还在在Windows下使用proxmark3?弱爆了! 本文作者:i春秋签约作家——冰尘 作为一个标准的日天日地日空气的(单身贵族泰迪)物理黑客Proxmark3这么高大上的东西应该是在键盘敲打声中 ...

  4. 关于MySQL连接抛出Authentication Failed错误分析

    [问题描述] 在应用端,偶尔看到有如下报错: Authentication to host 'xxxx' for user 'yyyy' using method 'mysql_native_pass ...

  5. windows系统正常但linux系统下找不到文件的问题

    问题描述:最近一个项目开发环境是windows系统,正式环境是linux系统.验证码图片在开发环境正常,但是在正式环境下一直报404. 问题原因:File dir = new File(realPat ...

  6. Python绑定方法与非绑定方法

    绑定方法 绑定方法(绑定给谁,谁来调用就自动将它本身当作第一个参数传入): 绑定到类的方法:用classmethod装饰器装饰的方法,类在使用时会将类本身当做参数传给类方法的第一个参数(即便是对象来调 ...

  7. js获取url地址的参数的方法

    js获取url参数值 今天说一下如何获取url参数值. 思路 通过location的search就可以获取到url中问号后面的值. 字符串过滤到问号 通过split方法分割参数集合 循环赋值 匹配对应 ...

  8. Python基础3：字符编码

    http://www.jb51.net/article/64917.htm Python 编码为什么那么蛋疼? https://i.cnblogs.com/EditPosts.aspx?postid= ...

  9. Java之集合(二十)LinkedBlockingQueue

    转载请注明源出处:http://www.cnblogs.com/lighten/p/7503678.html 1.前言 本章介绍阻塞队列LinkedBlockingQueue,这是一个基于链表的可选长 ...

  10. 【java排序】 选择排序，插入排序，希尔算法

    一.选择排序 1.基本思想:在要排序的一组数中,选出最小的一个数与第一个位置的数交换:然后在剩下的数当中再找最小的与第二个位置的数交换,如此循环到倒数第二个数和最后一个数比较为止. 2.实例 3.算法 ...