随笔- 75 文章- 5 评论- 6 阅读- 57551

MVC几种传值方式

一，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

100

101

102

103

104

105

106

107

108

109

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>

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

四，使用部分视图传递多个Model

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

123

124

125

126

127

128

129

130

131

132

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>@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>

TeacherPV.cshtml与StudentPV.cshtml

五，使用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))