MVC-04 视图(2)
三、View如何从Aciton取得数据
从Action取得数据,在ASP.NET MVC可区分成两种方式,一种是“使用弱类型取得数据”,另一种则是“使用强类型取得数据”,两者的差别在于View页面最上方声明的方式。
如果View页面使用弱类型接收来自Controller的数据,在View页面里完全不需要有任何声明,数据可以从ViewData、ViewBag或TempData取得,在页面中也可以通过@Model属性,取得从Action传来的ViewData.Model数据模型,但@Model数据模型的类型将会是object,所以算是弱类型的传值方式。
如果View页面使用强类型方式接收来自Controller的数据,那么,必须在View页面的第一行使用@model关键字引入一个View页面专用的数据模型类型参考。使用这种方式有助于提升View的开发效率,因为可以使用Visual Studio 2012的Intellisense提示功能。
1.使用弱类型模型取得数据
2.使用强类型模型取得数据
四、HTML辅助方法
顾名思义,HTML辅助方法(HTML Helper)就是用来辅助产生HTML只用,在开发View的时候一定会面对许多HTML标签,处理这些HTML的工作非常繁琐,为了降低View的复杂度,可以使用HTML辅助方法帮助你产生一些HTML标签或内容,因这些HTML标签都有固定标准的写法,所以将其包装成HTML辅助方法,可让View开发更快速,也可以避免不必要的语法错误。
ASP.NET MVC中内建了许多HTML辅助方法,这些HTML辅助方法都是利用C#3.0的扩充方法特性,将各种不同的HTML辅助方法扩充在HtmlHelper类别里,并且都拥有多载。
1.使用HTML辅助方法输出超链接
@Html.ActionLink("链接文字","ActionName")
@Html.ActionLink("链接文字","ActionName","ControllerName")
@Html.ActionLink("链接文字","ActionName",new{id=123,page=5})
@Html.ActionLink("链接文字","ActionName",null,new{@class="btnLink"})
使用Html.AcionLink()时,第一个参数为超链接的显示文字,此参数不可以输入空字符串、空白字符串或null值,否则会跑出The Value cannot be null or empty的异常。
如果想设计一个包含超链接的图片按钮,可选择用<a>超链接标签来输出,并通过CSS加上一个背景图,如下。
<a href="@Url.Action("ActionName")" class="lnkButton"></a>
ASP.NET MVC还有另一个Html.RouteLink辅助方法,其用法与Html.ActionLink非常相似,差别仅在于输入的参数要以RouteValue为主。
2.使用HTML辅助方法输出表单
(1)产生表单元素
使用using语法产生表单标签:
@using(Html.BeginForm("About","Home"))
{
@Html.TextArea("Date")
@Html.TextArea("MEMO")
<input type="submit"/>
}
使用Html.BeginForm辅助方法输出的表单预设输出的method属性会是POST,如果想指定为GET的话,可以输入第三个参数,如下。
@using(Html.BeginForm("Search","Home",FormMethod.Get))
{
@Html.TextArea("Keyword")
<input type="submit" />
}
如果想要用HTML表单实现文件上传的功能,那么必须在输出的<form>表单标签加上一个enctype属性,且内容必须设定为multipart/form-data,如下。
@using(Html.BeginForm("Upload","File",FormMethod.Post,new{enctype="multipart/form-data"}))
{
@Html.TextBox("File1","",new{type="file",size=""})
<input type="submit"/>
}
Html辅助方法并没有File方法,因此必须用TextBox方法来代替,并传入第三个参数将内建的type属性换成file即可。
(2)模拟各种HTTP动词
由于HTML表单无法送出DELETE这个HTTP动词,如果希望Action能够提供如同RESTful风格的方式来处理删除动作,又同时能够利用同一个表单来使用这个只能允许HttpDelete的动作的话,可以利用Html.HttpMethodOverride这个HTML辅助方法来模拟HTTP DELETE的行为,而模拟的方法其实只是加入一个隐藏栏位在表单里而已。
@using(Html.BeginForm("DeleteMessage","Message")
{
@Html.HttpMethodOverride(HttpVerbs.Delete)
@Html.Hidden("ID")
<input type="submit" value="删除此条数据" />
}
(3)常用表单输入栏位
Html.BeginForm()
Html.EndForm()
Html.Label()
Html.TextBox()
Html.TextArea()
Html.Password()
Html.CheckBox()
Html.RadionButton()
Html.DropDownList(),输出<select>标签。
Html.ListBox()
Html.Hidden()
Html.ValidationSummary()
Html.Id()
Html.Name()
Html.Value()
标签和文本框使用如下:
@Html.Label("Username","账户")
@Html.TextBox("Username")
标签for属性的值与input的id属性值一致的话,点击标签光标就会停留在文本框上,增加表单的易用性。Html.TextBox的多载如下:
@Html.TextBox("Username", "will")
@Html.TextBox("Username", "will", new { id="testID"})
public ActionResult HelperSample1()
{
IDictionary<string, object> attr = new Dictionary<string, object>();
attr.Add("size", "");
attr.Add("style", "color:red;");
ViewData["Dictionary"] = attr;
return View();
}
@{
var htmlAttribute = ViewData["Dictionary"] as IDictionary<string, object>;
}
@Html.TextBox("name","Value",htmlAttribute)<br />
@Html.Password("password","Value",htmlAttribute)<br />
@Html.TextBox("email","Value",htmlAttribute)<br />
@Html.TextBox("tel","Value",htmlAttribute)<br />
@Html.Hidden("id","")
Html.DropDownList()的使用方式如下。
public ActionResult HelperSample2()
{
List<SelectListItem> listItem = new List<SelectListItem>();
listItem.Add(new SelectListItem { Text = "是", Value = "" });
listItem.Add(new SelectListItem { Text = "否", Value = "" });
ViewData["List"] = new SelectList(listItem, "Value", "Text", "");
return View();
}
@Html.DropDownList("List", ViewData["List"] as SelectList, "请选择")
(4)使用强类型辅助方法
ASP.NET MVC从2.0版开始更进一步地提供了强类型的辅助方法,避免因为输入错误而导致数据没有显示或是编辑时无法存储的问题,除此之外,如果能活用这些强类型辅助方法还能提升整体开发效率。
基本上,属于强类型的辅助方法命名方式皆为“原先的名称最后加上For”,例如,Html.TextBoxFor()或Html.LabelFor()。使用强类型辅助方法,在View页面的最上方一定要用@model定义出这个View页面的参考数据模型。
Html.LabelFor(),显示字段的名字。
Html.TextBoxFor()
Html.TextAreaFor()
Html.PasswordFor()
Html.CheckBoxFor()
Html.RadioButtonFor()
Html.DropDownListFor()
Html.ListBoxFor()
Html.HiddenFor() ,生成HTML窗体的隐藏域。
Html.NameFor()
Html.ValueFor()
Html.DisplayNameFor(),获取模型的显示名称,有时是模型实体类的名称。
Html.DisplayTextFor()
Html.ValidationMessageFor(),是用来显示字段验证的错误消息。
Html.EditorFor(),用来输出表单域可编辑文本框。
做一个例子,首页显示商品明细,点击添加商品链接,打开添加商品页面,输入信息可添加商品。商品的模型类和添加商品页面代码如下:
public class Product
{
public int Id { get; set; } [Required]
[DisplayName("产品名称")]
public string Name { get; set; } [MaxLength()]
[DisplayName("产品说明")]
public string Description { get; set; } [Required]
public int UnitPrice { get; set; }
}
@model MvcApplication1.Models.Product @using(Html.BeginForm())
{
@Html.ValidationSummary(true) <fieldset>
<legend>产品资讯</legend> <div class="editor-lable">
@Html.LabelFor(model=>model.Name)
</div>
<div class="editor-field">
@Html.TextBoxFor(model=>model.Name)
@Html.ValidationMessageFor(model=>model.Name)
</div> <div class="editor-label">
@Html.LabelFor(model=>model.Description)
</div>
<div class="editor-label">
@Html.TextAreaFor(model=>model.Description)
@Html.ValidationMessageFor(model=>model.Description)
</div> <p>
<input type="submit" />
</p>
</fieldset>
}
3.使用HTML辅助方法载入分部视图
以往在ASP.NET Web form的开发经验中,对于User Control使用非常频繁,不但可以减少重复的代码,也利于将页面模块化,这个好用的概念也可以用在ASP.NET MVC中,只不过换了一个名字,称为“分部视图(Partial View)”。
(1)什么是分部视图
从Partial View的字面上翻译,很容易了解它就是一个片段的View,因此,可以利用Partial View把部分的HTML或显示逻辑包装起来,方便重复引用。当你将建立出来的分部视图放置于View\Shared目录时,任何Controller下的Action或View都可以载入。
分部视图的应用范围相当广,因为是片段的HTML或显示逻辑,因此,整体重复性高或某段HTML会共同出现在多个视图页面中的网页片段,利用分部视图来开发会是不错的选择,并且基于这个优点,Ajax技术所需要的片段View也就更适合使用分部视图。
(2)如何建立一个分部视图
建立分部视图与建立视图的步骤一样,在项目的/Views/Shared目录上,单击鼠标右键,在弹出的快捷菜单中选择“添加”->“视图”命令。接着,选中“创建为分部视图”复选框即可。
使用分部视图不一定需要建立相关的Action,因为它仅仅是片段的HTML,且调用时,也不会调用Action来执行。
(3)如何载入分部视图
Partial(HtmlHelper, String) | Html.Partial("ajaxPage")
Partial(HtmlHelper, String, Object) | Html.Partial("ajaxPage", Model)
Partial(HtmlHelper, String, ViewDataDictionary) | Html.Partial("ajaxPage", ViewData["Model"])
Partial(HtmlHelper, String, Object, ViewDataDictionary) | Html.Partial("ajaxPage", Model, ViewData["Model"])
例子1,分部视图OnlineUserCounter代码如下。
<span style="color:red">线上人数:</span>
在Home/Index视图中载入分部视图。
@Html.Partial("OnlineUserCounter")
(4)从控制器载入分部视图
(5)使用Html.Action辅助方法载入分部视图
4.使用视图模板输出内容
5.自定义HTML辅助方法
使用HTML辅助方法可以让开发View页面的过程节省不少时间,但有时候难免会觉得内建的HTML辅助方法不太够用,怎么办才好呢?ASP.NET MVC的另一项优点就是“高扩充性”,此刻就派上用场。ASP.NET MVC允许开发人员自行扩充HTML辅助方法,而且方法众多,你可以选择喜爱的方式来建立适当的HTML辅助方法。
6.Html.ValidationSummary()可以输出表单验证失败时的错误信息摘要
下面哪个HTML辅助方法,可以输出表单验证失败时的错误信息摘要( )。
A.Html.Hidden B. Html.ValidationSummary()
C.Html.ErrorMsg() D.Html.ValidationMsg()
MVC-04 视图(2)的更多相关文章
- ASP.NET MVC——Razor视图引擎
Razor是MVC框架视图引擎,我们今天就来说一说Razor视图引擎. 首先还是来创建一个基础项目叫Razor来演示. 先来定义一个Model叫Product public class Product ...
- 体验 ASP.NET Core 1.1 中预编译 MVC Razor 视图
这是从 ASP.NET Core 1.1 官方发布博文中学到的一招,可以在 dontet publish 时将 Razor 视图编译为 .dll 文件. 需要在 project.json 中添加如下配 ...
- ASP.NET MVC 5 - 视图
在本节中,你要去修改HelloWorldController类,使用视图模板文件,在干净利索地封装的过程中:客户端浏览器生成HTML. 您将创建一个视图模板文件,其中使用了ASP.NET MVC 3所 ...
- asp.net mvc 部分视图加载区别
ASP.NET MVC 部分视图 ASP.NET(11) 版权声明:本文为博主原创文章,未经博主允许不得转载. [部分视图] ASP.NET MVC 里的部分视图,相当于 Web Form 里的 ...
- MVC中视图View向控制器传值的方法
MVC中视图View向控制器传值的方法步骤如下: 1.index页面: 页面中只需要一个触发事件的按钮
- mvc的视图中显示DataTable的方法
mvc的视图中显示DataTable的方法: 不断的循环画出table @{ ViewBag.Title = "ShowDataTable"; } @using System.Da ...
- 第5章——使用 Razor(MVC框架视图引擎)
Razor 是MVC框架视图引擎的名称. 本章提供 Razor 语法的快速教程,以使你能够识别 Razor 表达式. 本章不打算提供 Razor 的完整参考,而将其视为一个语法速成教程.在本书的后续内 ...
- mvc 分部视图(Partial)显示登陆前后变化以及Shared文件夹在解决方案资源管理器中没有显示的问题
刚开始我的解决方案资源管理器中没有显示Shared文件夹,但Shared文件夹在项目中是实际存在的,我搜了下好像没有类似的解答(可能是我搜索的关键词不够准确).后来自己看了下vs2012. 其实解决方 ...
- [转]ASP.NET MVC 5 - 视图
在本节中,你要去修改HelloWorldController类,使用视图模板文件,在干净利索地封装的过程中:客户端浏览器生成HTML. 您将创建一个视图模板文件,其中使用了ASP.NET MVC 3所 ...
- Asp.net MVC Razor视图模版动态渲染PDF,Razor模版生成静态Html
Asp.net MVC Razor视图模版动态渲染PDF,Razor模版生成静态Html 1.前言 上一篇文章我开源了轮子,Asp.net Core 3.1 Razor视图模版动态渲染PDF,然后,很 ...
随机推荐
- c# 针对不同数据库进行参数化查询
使用参数化 DbCommand 的一个缺点是需要参数的代码将仅适用于支持相同语法的提供程序.OLEDB.SqlClient 和 Oracle 提供程序全部使用不同的语法.例如,用于命名和指定参数的 S ...
- 设计模式- 主动对象(Active Object)
译者注:1.对象分为主动对象和被动对象,主动对象内部包含一个线程,可以自动完成动作或改变状态,而一般的被动对象只能通过被其他对象调用才有所作为.在多线程程序中,经常把一个线程封装到主动对象里面.2.在 ...
- JavaSE复习日记 : 接口
/* * 接口 * 引用数据类型: * 类,接口,数组; * * 接口是一种引用数据类型,可以看作是一个特殊的类,它存在的目的是为了解决没有多重继承引起的功能弱的问题而设计的,一个类只能有一个父类,但 ...
- 网络技术教程笔记(20)ISDN
广域网与接入网技术 广域网与接入网技术 常见接入技术--ISDN 综合业务数字网(Integrated Services Digital Network,ISDN)由电话综合数字网IDN演化而成,能够 ...
- SQL 处理空值
问题: 在数据库中经常会有为null和''的值的列,在查询的时候,我们需要将它们转化成有效的值. 解决方案: 在emp表中的comm注释有的为null有的为'',在查询的时候 我们希望没有注释的显示为 ...
- 去掉iphone 的圆角样式
每次面对iphone这种丑丑的样式,我简直不能再愉快的写代码~~而且每次记不住那烦人的属性~~~必须记录下来~~ -webkit-appearance:none 为了下次不用再百度,终于背下来~~~
- watch命令详解(linux)
watch命令详解(linux) 在维护系统时经常需要实时查看系统的运行情况,比如实时的系统连接数之类的.在linux可以通过watch命令,实时监控每一条命令执行的结果动态变化. ...
- 少部分手机浏览器对于COOKIE支持不够导致服务端无法读取session的解决方案
相信大家都遇到过这样的问题,有手机浏览器的问题导致服务端SESSION读取不正常,目前在项目中的解决方法是采取H5手机本地存储唯一KEY解决的 代码片段 //定义json格式字符串 var userD ...
- 本地环境下 WordPress 环境搭建与安装
本地环境:Ubuntu 14.04 使用软件: WordPress 4.1.1 中文优化版 EasyEngine 安装步骤: 安装 LNMP 环境; wget -qO ee rt.cx/ee & ...
- Auto login to your computer
in run dialog, type in following words and enter Rundll32 netplwiz.dll,UsersRunDll On user account d ...