ASP.NET MVC教程四：ASP.NET MVC中页面传值的几种方式
准备
在Models文件夹里面新添加Student实体类，用来模拟从Controller向View传递数据，Student类定义如下：
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;namespace MVCStudyDemo.Models
{public class Student{public int ID { get; set; }public string Name { get; set; }public int Age { get; set; }public string Sex { get; set; }public string Email { get; set; }}
}一、通过ViewData传值
MVC从开始版本就一直支持使用ViewData将Controller里面的数据传递到View。ViewData定义如下：
从上面的截图中可以看出，ViewData里面存的是字典类型的数据，在查看ViewDataDictionary的定义：
注意：ViewDataDictionary继承自IDictionary等接口，所以ViewData里面的Value值类型是object的，使用的时候需要进行类型转换。
新建Controller，并命名为ViewDataDemo，该Controller用来模拟通过ViewData向View传递数据
Controller代码如下：
using MVCStudyDemo.Models;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;namespace MVCStudyDemo.Controllers
{public class ViewDataDemoController : Controller{// GET: ViewDataDemo/// <summary>/// 通过ViewData向对应的View传递数据/// </summary>/// <returns></returns>public ActionResult Index(){// 1、将字符串传递到ViewViewData["Other"] = "通过ViewData向View传递字符串";// 2、通过KeyValuePair添加ViewData.Add(new KeyValuePair<string, object>("name","tom"));// 3、直接添加ViewData.Add("age", 23);// 4、传递集合到ViewViewData["Data"] = new List<Student>(){new Student{ID = 1,Name = "唐僧",Age = 34,Sex = "男",Email = "747976523@qq.com"},new Student{ID = 2,Name = "孙悟空",Age = 635,Sex = "男",Email = "sunwukong@163.com"},new Student{ID = 3,Name = "白骨精",Age = 4532,Sex = "女",Email = "74345523@qq.com"}};// 返回同名的视图return View();}}
}对应的View视图代码如下：
@*引入Student的命名空间*@
@using MVCStudyDemo.Models;
@{ViewBag.Title = "Index";// 这里使用的是Razor语法，写的是后台C#代码// ViewData的Value值是Object类型的，需要进行类型转换// 常规写法是先在这里进行类型转换var list = ViewData["Data"] as List<Student>;
}<h2>通过ViewData向View传递数据</h2>
<div class="jumbotron"><div><div>1、传递字符串 other:@ViewData["Other"];</div><div>2、传递字符串 name:@ViewData["name"];</div><div>3、传递字符串 age:@ViewData["age"];</div><div>4、传递集合方式一@foreach (var item in list){<div>ID:@item.ID Name:@item.Name Age:@item.Age Sex:@item.Sex Email:@item.Email</div>}</div><div>5、传递集合方式二@foreach (var item in ViewData["Data"] as List<Student>){<div>ID:@item.ID Name:@item.Name Age:@item.Age Sex:@item.Sex Email:@item.Email</div>}</div></div>
</div>运行结果：
二、通过ViewBag传值
ViewBag是在MVC3中出现的，ViewBag是动态（dynamic）类型的。
新建Controller，并命名为ViewBagDemo，该Controller用来模拟通过ViewBag向View传递数据。
Controller代码：
using MVCStudyDemo.Models;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;namespace MVCStudyDemo.Controllers
{public class ViewBagDemoController : Controller{// GET: ViewBagDemo/// <summary>/// 通过ViewBag向View传递数据/// </summary>/// <returns></returns>public ActionResult Index(){// 通过ViewData传值ViewData["name"] = "ViewData";// 传递集合到ViewViewData["Data"] = new List<Student>(){new Student{ID = 1,Name = "唐僧",Age = 34,Sex = "男",Email = "747976523@qq.com"},new Student{ID = 2,Name = "孙悟空",Age = 635,Sex = "男",Email = "sunwukong@163.com"},new Student{ID = 3,Name = "白骨精",Age = 4532,Sex = "女",Email = "74345523@qq.com"}};// 通过ViewBag传值ViewBag.Name = "ViewBag";ViewBag.StudentData = new Student(){ID = 5,Name = "沙悟净",Age = 567,Sex = "男",Email = "4567890345@qq.com"};// 返回同名视图return View();}}
}对应的Index视图代码：
@*引入Student的命名空间*@
@using MVCStudyDemo.Models;
@{ViewBag.Title = "Index";// ViewBag是dynamic类型的，使用的时候不需要进行类型转换var stu = ViewBag.StudentData;var stuList = ViewBag.Data;
}<h2>通过ViewBag向View传递数据</h2>
<div class="jumbotron"><div><div>Controller通过ViewBag向View传递数据</div><div>1、通过ViewData传递字符串 ViewData["name"]:@ViewData["name"];</div><div>2、通过ViewBag传递字符串 ViewBag.name:@ViewBag.Name;</div><div>3、输出stu<div>ID:@stu.ID Name:@stu.Name Age:@stu.Age Sex:@stu.Sex Email:@stu.Email</div>4、输出stuList@foreach (var item in stuList){<div>ID:@item.ID Name:@item.Name Age:@item.Age Sex:@item.Sex Email:@item.Email</div>}</div></div>
</div>运行结果；
看了上面的运行结果，你可能会提出如下的两个疑问：
1、Controller里面没有定义ViewBag.Data，为什么在这里可以使用呢？
这是因为ViewBag是从MVC3版本才开始出现的，为了兼容以前的ViewData，所以这里虽然没有定义ViewBag.Student，但是ViewBag可以使用ViewData里面定义的Data数据。
2、ViewData["name"]和ViewBag.name的值是一样的
在控制器里面明明设置的两个值是不同的，但是为什么这里都变成一样的了呢？这是因为ViewData和ViewBag的属性是重叠的，两者都是字典类型的，一切以后面定义的属性为准，即后面定义的会覆盖前面定义的。
修改Controller代码，将ViewData的顺序放到ViewBag后面：
using MVCStudyDemo.Models;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;namespace MVCStudyDemo.Controllers
{public class ViewBagDemoController : Controller{// GET: ViewBagDemo/// <summary>/// 通过ViewBag向View传递数据/// </summary>/// <returns></returns>public ActionResult Index(){// 通过ViewData传值//ViewData["name"] = "ViewData";// 传递集合到ViewViewData["Data"] = new List<Student>(){new Student{ID = 1,Name = "唐僧",Age = 34,Sex = "男",Email = "747976523@qq.com"},new Student{ID = 2,Name = "孙悟空",Age = 635,Sex = "男",Email = "sunwukong@163.com"},new Student{ID = 3,Name = "白骨精",Age = 4532,Sex = "女",Email = "74345523@qq.com"}};// 通过ViewBag传值ViewBag.Name = "ViewBag";ViewBag.StudentData = new Student(){ID = 5,Name = "沙悟净",Age = 567,Sex = "男",Email = "4567890345@qq.com"};// 把ViewData的顺序放到ViewBag后面ViewData["name"] = "ViewData";// 返回同名视图return View();}}
}在查看Index视图显示效果：
这时会发现，Index视图里面显示的都是ViewData的值了。
三、通过TempData传值
新建Controller，并命名为TempDataDemo，该Controller用来模拟通过TempData向View传递数据。
Controller代码：
using MVCStudyDemo.Models;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;namespace MVCStudyDemo.Controllers
{public class TempDataDemoController : Controller{// GET: TempDataDemopublic ActionResult Index(){// ViewDataViewData["Name"] = "tom";// ViewBageViewBag.Name = "Jon";// TempDataTempData["Name"] = "Andi";TempData["Stu"] = new Student(){ID = 5,Name = "沙悟净",Age = 567,Sex = "男",Email = "4567890345@qq.com"};// 返回同名视图return View();}}
}对应的Index视图代码：
@*引入Student的命名空间*@
@using MVCStudyDemo.Models;
@{ViewBag.Title = "Index";
}
@{// 类型转换var stu = TempData["Stu"] as Student;
}<h2>通过TempData向View传递数据</h2>
<div class="jumbotron"><p><div><div>通过ViewData传递字符串 ViewData["Name"]:@ViewData["Name"];</div></div></p><p><div><div>通过ViewBag传递字符串 ViewBag.Name:@ViewBag.Name;</div></div></p><p><div><div>1、传递字符串 TempData["Name"]:@TempData["Name"];</div>2、输出stu<div>ID:@stu.ID Name:@stu.Name Age:@stu.Age Sex:@stu.Sex Email:@stu.Email</div></div></p>
</div>运行结果：
从上面的结果中可以看出：TempData的属性值不会覆盖上面定义的属性值。那TempData还有什么作用呢？在看下面的代码：
using MVCStudyDemo.Models;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;namespace MVCStudyDemo.Controllers
{public class TempDataDemoController : Controller{// GET: TempDataDemopublic ActionResult Index(int? id){// ViewDataViewData["Name"] = "tom";// ViewBageViewBag.Name = "Jon";// TempDataTempData["Name"] = "Andi";TempData["Stu"] = new Student(){ID = 5,Name = "沙悟净",Age = 567,Sex = "男",Email = "4567890345@qq.com"};if(id==null){// 跳转到TempDataTest方法return RedirectToAction("TempDataTest");}else{// 返回同名视图return View();} }public ActionResult TempDataTest(){// 返回同名视图return View();}}
}TempDataTest视图代码：
@*引入Student的命名空间*@
@using MVCStudyDemo.Models;
@{ViewBag.Title = "TempDataTest";// 类型转换var stu = TempData["Stu"] as Student;
}<h2>TempDataTest</h2>
<h3>ViewData["Name"]:@ViewData["Name"]</h3>
<h3>ViewBage.Name:@ViewBag.Name</h3>
<h3>TempData["Name"]:@TempData["Name"];</h3>
<h3>ID:@stu.ID Name:@stu.Name Age:@stu.Age Sex:@stu.Sex Email:@stu.Email</h3>在浏览器里面输入下面的URL地址：http://localhost:9080/TempDataDemo/index，这就表示传递的id是null值，运行结果：
你会发现这时ViewData和ViewBag都取不到数据了，只有TempData可以取到数据，可以得出TempData和ViewData、ViewBag的区别：
TempData是基于session存储的，单次请求数据不丢失（ViewData和ViewBag会丢失），后台跨页面传值，只能用一次
四、Model传值
在Action放过里面的View上面F12转到定义：
可以看到View有很多重载，其中一种可以直接传递model，如上面截图中红框所示。
新建Controller，并命名为ModelDemo，该Controller用来模拟通过Model向View传递数据。
对应的controller代码：
using MVCStudyDemo.Models;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;namespace MVCStudyDemo.Controllers
{public class ModelDemoController : Controller{// GET: ModelDemopublic ActionResult Index(){Student student = new Student(){ID = 5,Name = "沙悟净",Age = 567,Sex = "男",Email = "4567890345@qq.com"};// 返回modelreturn View(student);// 或者直接返回//return View(new Student()//{// ID = 5,// Name = "沙悟净",// Age = 567,// Sex = "男",// Email = "4567890345@qq.com"//});
}}
}Index视图代码：
@{ViewBag.Title = "Index";
}<h2>通过Model向View传值</h2>
<h3>ID:@Model.ID</h3>
<h3>Name:@Model.Name</h3>
<h3>Age:@Model.Age</h3>
<h3>Sex:@Model.Sex</h3>
<h3>Email:@Model.Email</h3>运行结果：
转载于:https://www.cnblogs.com/dotnet261010/p/11416941.html
ASP.NET MVC教程四：ASP.NET MVC中页面传值的几种方式相关推荐
- ASP.Net中页面传值的几种方式
大致概括一下,ASP.NET 页面之间传递值得方式大致可以分为如下几种:Request.QueryString["name"],Request.Form("name&qu ...
- ASP.NET页面传值的几种方式
一.目前在ASP.NET中页面传值共有这么几种方式: 1.表单提交, <form action= "target.aspx" method = "post&q ...
- MVC教程第二篇：第一个页面
MVC教程第二篇:第一个页面 摘要 本文首先一步一步完成Demo的第一个页面--首页.然后根据实现过程,说明一下其中用到的与ASP.NET MVC相关的概念与原理. 让第一个页面跑起来 现在, ...
- 【转】ASP.NET中页面传值
http://www.cnblogs.com/wenly/archive/2008/06/10/1216678.html 一.目前在ASP.NET中页面传值共有这么几种方式: 1.表单提交, & ...
- 一、目前在ASP.NET中页面传值共有这么几种方式：
一.目前在ASP.NET中页面传值共有这么几种方式: 1.表单提交, <form action= "target.aspx" method = "post&q ...
- 【详细】传参的四种方式以及返回传值的三种方式
[转载]本文主要参考链接下博主文章,再行总结的 传参的四种方式 按值传参 在调用函数时,将实参的值拷贝给形参,形参在函数中被使用.对形参的操作不会影响到实参的值.但是因为发生了拷贝会增加系统开销. p ...
- c .net ajax,Asp.net mvc 2中使用Ajax的三种方式
在Asp.net MVC中,我们能非常方便的使用Ajax.这篇文章将介绍三种Ajax使用的方式,分别为原始的Ajax调用.Jquery.Ajax Helper.分别采用这三种方式结合asp.net m ...
- ASP.NET 页面之间传值的几种方式
对于任何一个初学者来说,页面之间传值可谓是必经之路,却又是他们的难点.其实,对大部分高手来说,未必不是难点. 回想2016年面试的将近300人中,有实习生,有应届毕业生,有1-3年经验的,有3-5年经 ...
- Asp.net中页面传值几种方式
页面传值是学习asp.net初期都会面临的一个问题,总的来说有页面传值.存储对象传值.ajax.类.model.表单等.但是一般来说,常用的较简单有QueryString,Session,Cookie ...
最新文章
- 基于SSM实现保健院管理系统
- 一次OutOfMemoryError: GC overhead limit exceeded
- java创建一个不可变对象_使用不可变对象创建值对象
- 如何删除虚拟机上的操作系统、删除新建的虚拟机
- 理解什么是前后端分离
- Java打包后读文件和写文件操作方法
- MySQL新建数据库时utf8_general_ci编码解释
- Mysql 排序null值 排序问题分析
- jquery城市选择案例
- iOS Mac终端 生成模拟器与真机都能运行的.a静态库
- 【BZOJ 2243 SDOI2011】染色【树链剖分】
- Java二维码的生成以及附加Logo
- 深入解析Struts拦截器的工作原理
- 【GIS】开源GIS简介
- 金融数据安全分类分级解决方案
- animation动画--跳动
- 如何查看电脑ip地址
- springtboot 操作es
- Android入门学习
- 求解带不确定事件的FJSP的多目标强化学习框架
热门文章
- STM32——系统滴答定时器
- python爬虫用什么软件写_python爬虫怎么写
- LeetCode 811. 子域名访问计数
- LeetCode 478. 在圆内随机生成点（概率）
- LeetCode 690. 员工的重要性（图的DFSBFS）
- 叛乱2正版怎么创服务器,Insurgency Linux Server 叛乱2创建服务器教程(转steam指南)
- java 主方法 this_java main 方法怎么创建
- nineoldandroid使用_nineoldandroid 详细使用并且实现drawerlayout侧滑动画
- linux安装g++编译器_Ubuntu Desktop下配置Rosetta安装教程
- Python基础（八）--迭代，生成器，装饰器与元类