ASP.NET MVC5----了解我们使用的@HTML帮助类

简介: ASP.NET MVC5----了解我们使用的@HTML帮助类

                                        20几岁,怕什么。


自己的感觉  


       说一个自己最近使用AngularJS的感受,我们之前使用mvc进行项目开发都是了解和经常使用HTML的帮助类,来完成我们前端大部分代码的编写,其实在我没有接触AngularJS之前对于这种方法还是很喜欢的,毕竟它是将.aspx页面革命掉的东西,但是随着项目中使用AngularJS我越来越喜欢这种将前后端分开的开发模式,我相信这就是以后的发展形势。但是眼下这个MVC还是要快快的用好。


:了解HTML帮助类的内在美



HTML辅助方法利用路由引擎找到HomeController控制器的Search操作,他在后台使用GetVirtualPath方法,该方法在RouteTable的Routes属性中,在global.asax中,Web应用程序注册所有的路由位置。


protected void Application_Start()
{
    AreaRegistration.RegisterAllAreas();
    WebApiConfig.Register(GlobalConfiguration.Configuration);
    FilterConfig.RegisterGlobalFilters(GlobalFilters.Filters);
    RouteConfig.RegisterRoutes(RouteTable.Routes);
    BundleConfig.RegisterBundles(BundleTable.Bundles);
}

通过RouteConfig.RegisterRoutes(RouteTable.Routes);来实现我们辅助方法的实现。下面我们看下要是不需要这个,如何实现我们的辅助方法。



一般的写法:

@using (Html.BeginForm("Search","Admin",FormMethod.Post))
{
    <input type="text" name="text"/>
    <input type="submit" name="sub" value="Search"/>
}

不使用HTML帮助类的写法:

@{
    var context = this.ViewContext.RequestContext;   //请求上下文
    var values = new RouteValueDictionary               //不区分大小写的键值对集合
    {
        {"controller","home"},
        {"action","index"}
    };
    var path = RouteTable.Routes.GetVirtualPath(context, values);      //返回与路由相关的URL
}
<form action="@path.VirtualPath",method="POST">
    <input type="text" name="text" />
    <input type="submit" name="sub" value="Search" />
</form>


现在我们看要是不使用帮助类就必须写这么多的代码,可以发现VS将我们需要写的代码全都封装起来,使用起来很方便。


辅助方法工作原理


每一个Razor视图都继承了它们的基类HTML属性,HTML属性的类型是


System.Web.Mvc.HtmlHelper;T是一个泛型类型的参数,代表传递给视图的模型类型(默认是dynamic),这个属性提供了一些可以在视图中调用的实例方法,还有很多扩展方法(.出来,方法名称左边有一个向下的箭头)。


:常用的辅助方法


---:每一个辅助方法都有一个htmlattributs属性,可以设置页面的html属性。


---:辅助方法大多数都是检查ViewDate对象以获取要显示的当前值(ViewBag对象中所有值也可以获取到)


---:辅助方法不仅可以查看ViewData内部的数据,也可以得到模型元数据 。


  • Html.BeginForm


提交表单时使用,这个一般和@using(){}一起,这样就可以释放掉资源。辅助方法在调用结束期间生成一个起始标签,并返回一个实现了接口IDisposable的对象。这样就可以在using(){]方法里面被释放掉。


  • Html.ValidationSummary()
@Html.ValidationSummary(excludePropertyErrors:true)   //显示模型级别的错误。


此方法用来显示ModelState字典中所有验证错误的无序列表,使用参数(bool)来告知辅助方法错误的级别。(显示与模型本身相关的错误,不显示模型属性相关的错误。)


public ActionResult Search()
{
    ModelState.AddModelError("","模型级别的错误");   //设置为true
    ModelState.AddModelError("Title", "模型属性级别的错误");   //设置为false
    return View();
}


  • Html.TextBox和Html.TextArea


都是显示文本,第一个是文本框Text,第二个是TextArea;TextArea可以设置显示指定的行数和列数。


679140-20160923133059371-1080197069.png


  • Html.Label


返回一个label元素,并使用String类型的参数来决定渲染的文本和for特性值。这个一般使用显示输入框的标题。将模型属性中的Display(“姓名”)显示出来。


[Display(Name = "姓名")]
public string Name { get; set; }



  • Html.DropDownList和Html.ListBox


这两个都是返回一个<select/>元素。DropDownList第一个是单向选择,ListBox为多项选择。


关于下拉列表,它需要一个包含所有可选项的SelectListItem对象集合,其中每一个SelectListItem对象集合中有包含有Text,Value和Selected三个属性。

可以根据需要构建自己的SelectListItem对象集合。


看一下之前项目中使用的下拉,之前不是很理解原理,现在看书说是为了避免反射开销的同时自己生成的SelectListItem集合,使用的是Linq的Select方法来将SelectListItem对象集放入项目中。


 

  • Html.ValidationMessage


当ModelState字典中的某一特定字段出现错误时,可以使用ValidationMessage辅助方法来显示相应的错误消息。这个一般情况就是在服务端验证的时候显示错误消息。


  • Html.Hidden


将一些必要的属性(ID)通过隐藏的方式传递--提交表单。


  • Html.PassWord


这个是密码框输入的值为隐藏的。之前一直没有使用这个,看来以后要多多使用。



  • Html.RadioButton


单选按钮一般组合使用,为用户的单项选择提供一组可选项。


@Html.RadioButton("color","red",true)
@Html.RadioButton("color","blue")
@Html.RadioButton("color", "green")


  • Html.CheckBox


是唯一一个渲染两个输入元素的辅助方法。是一个隐藏域hidden。


@Html.CheckBox("checkbox")


679140-20160923133100746-521213968.png


模版辅助方法


利用元数据和模版构建HTML,其中元数据包括关于模型值(名称和类型)的信息和(通过数据注解或自定义提供器添加)模型元数据。


  • Html.Display


可以操作模型上面绑定的一些值。


  • Html.Editor


也是设置文本框的,好的一点是可以通过模型上面绑定的值来显示HTML。


辅助方法与ModelState



用户显示表单值得所有辅助方法也需要与ModelState字典交互。其实ModelState是模型绑定的副产品,并且存储模型绑定期间检测到的所有验证错误,以及用户提交用来更新模型的原始值(验证失败,再次回到视图中显示之前输入的值)。


渲染辅助方法


  • Html.ActionLink


渲染成一个超链接。这个效果是一个默认路由。


  • Url.Action


这个是渲染一部分路径。



@Html.ActionLink("Link Text","Index")    
<br />
<a href="@Url.Action("Index")">123</a>


679140-20160923133101793-1939621849.png


  • Html.RouteLink


这个说实在的和前面那个是一样的。只是这个只可以接收路由名称,而不能接收控制器名称和操作方法


@Html.RouteLink("Link Text",new{Action="Index"})



URl辅助方法


  • Url.Action


这个和之前介绍的一样。这个只是显示部分路径。


  • Url.Content


可以把用户程序的相对路径转换为绝对路径。现在项目中还没使用过。

@Url.Content("~/Scripts/_references.js")   //~:可以看作为应用程序的根目录


  • Url.RouteUrl


和之前一样,只接收路由名。


Html.Partial和Html.RenderPartial


Partial方法用于将部分视图渲染为字符串。也就是局部试图。


RenderPartial返回的不是字符串,而是直接写入响应输出流。使用的时候必须将此放入代码块中。


@{
    Html.RenderPartial("List");
}



Html.Action和Html.RenderAction


和上面的一样,Partial辅助方法通常在单独的文件中应用视图标记来帮助视图渲染视图模型的一部分,Action执行单独的控制器操作,并显示结果。其实action是需要走方法里面的。需要执行一些逻辑的时候可以使用。


RenderAction也是可以直接写入响应流之中。用的地方不是很多。


@Html.Action("Search",new{student=new Student{Age = 12,Name = "Andyahui"}})
[ChildActionOnly]
public ActionResult Search(Student student)
{
    ModelState.AddModelError("","模型级别的错误");   //设置为true
    ModelState.AddModelError("Title", "模型属性级别的错误");   //设置为false
    return View();
}


679140-20160923133104121-1794160698.png



前面的都是一些常用的视图帮助类,我们可以使用他们来完成前台部分代码的编写。

目录
相关文章
|
3月前
|
开发框架 前端开发 JavaScript
ASP.NET MVC 教程
ASP.NET 是一个使用 HTML、CSS、JavaScript 和服务器脚本创建网页和网站的开发框架。
46 7
|
3月前
|
存储 开发框架 前端开发
ASP.NET MVC 迅速集成 SignalR
ASP.NET MVC 迅速集成 SignalR
74 0
|
4月前
|
前端开发 JavaScript
MVC中简单数据模型(M): Model类
MVC中简单数据模型(M): Model类
|
4月前
|
开发框架 前端开发 .NET
ASP.NET MVC WebApi 接口返回 JOSN 日期格式化 date format
ASP.NET MVC WebApi 接口返回 JOSN 日期格式化 date format
55 0
|
4月前
|
开发框架 前端开发 安全
ASP.NET MVC 如何使用 Form Authentication?
ASP.NET MVC 如何使用 Form Authentication?
|
4月前
|
开发框架 .NET
Asp.Net Core 使用X.PagedList.Mvc.Core分页 & 搜索
Asp.Net Core 使用X.PagedList.Mvc.Core分页 & 搜索
142 0
|
6月前
|
Web App开发 前端开发 Java
基于Spring3 MVC实现基于HTML form表单文件上传
基于Spring3 MVC实现基于HTML form表单文件上传
48 7
基于Spring3 MVC实现基于HTML form表单文件上传
|
7月前
|
开发框架 前端开发 .NET
ASP.NET CORE 3.1 MVC“指定的网络名不再可用\企图在不存在的网络连接上进行操作”的问题解决过程
ASP.NET CORE 3.1 MVC“指定的网络名不再可用\企图在不存在的网络连接上进行操作”的问题解决过程
211 0
|
7月前
|
开发框架 前端开发 JavaScript
JavaScript云LIS系统源码ASP.NET CORE 3.1 MVC + SQLserver + Redis医院实验室信息系统源码 医院云LIS系统源码
实验室信息系统(Laboratory Information System,缩写LIS)是一类用来处理实验室过程信息的软件,云LIS系统围绕临床,云LIS系统将与云HIS系统建立起高度的业务整合,以体现“以病人为中心”的设计理念,优化就诊流程,方便患者就医。
83 0
|
7月前
|
开发框架 前端开发 .NET
C# .NET面试系列六:ASP.NET MVC
<h2>ASP.NET MVC #### 1. MVC 中的 TempData\ViewBag\ViewData 区别? 在ASP.NET MVC中,TempData、ViewBag 和 ViewData 都是用于在控制器和视图之间传递数据的机制,但它们有一些区别。 <b>TempData:</b> 1、生命周期 ```c# TempData 的生命周期是短暂的,数据只在当前请求和下一次请求之间有效。一旦数据被读取,它就会被标记为已读,下一次请求时就会被清除。 ``` 2、用途 ```c# 主要用于在两个动作之间传递数据,例如在一个动作中设置 TempData,然后在重定向到另
362 5