首页 > 代码库 > mvc VIEW部分介绍

mvc VIEW部分介绍

因为如果在view页面中的路径直接写死为<from action="/Home/Save" method="post">那么当Global.asax.cs文件中的Routing自定义或随时修改后,还要连带修改数十个视图中的窗口发送路径.

在MVC中,我们可以使用Html.BeginForm()

 

Aspx代码  
  1. <%
  2. using (Html.BeginForm("Save","Home",FormMethod.Post)){
  3. %>
  4. 窗口内容
  5. <%}%>

 

Aspx代码  
  1. <%
  2. using (Html.BeginForm("Save","Home")){
  3. %>
  4. 窗口内容
  5. <%}%>

 

如果窗口送出的对象是同一个Action,那么可以简写为

Aspx代码  
  1. <%
  2. using (Html.BeginForm()){
  3. %>
  4. 窗口内容
  5. <%}%>

因为送出窗口的对象与当前视图所在的Controller相同,只是Action不同,所以可以通过View的RouteData.Values对象获取当前的所有路由值,并动态加载路由值中的Controller的名称

 

RouteData.Values

 

Aspx代码  
  1. <%
  2. using (Html.BeginForm(("Save",RouteData.Values["controller"].ToString())){
  3. %>
  4. 窗口内容
  5. <%}%>

使用 <%: Html.TextBox("姓名")%>为mvc2新建的强类型HTML辅助方法

 

使用强类型的好处在于可以有提示,不必担心把字段名称写错

 

Model要重、Controller要轻、View要够笨

 

 

HTML辅助方法:

MVC内置且常用的HTML辅助方法主要分为两大类:

用于生成超链接的HTML辅助方法,Html. ActionLink()、Html. RouteLink();

用于生成窗口元素的HTML辅助方法,包括Html.BeginForm()、Html. EndFrom()、Html. TextBox()、Html. TextArea()、Html. Password()、Html. Hidden()、Html. CheckBox()、Html. DropDownList()、Html. ListBox()、Html. RadioButton();

 

Html. ActionLink():

Aspx代码  
  1. <%=Html. ActionLink("超链接文字","actionName")%>
  2. <%=Html. ActionLink("超链接文字","actionName","controllerName")%>
  3. <%=Html. ActionLink("超链接文字","actionName","controllerName",new{id=123,page=5})%>

在使用Html. ActionLink()时,超链接文本处不可以输入空白或“null”值,否则会抛“The Value cannot be null or emtty”的异常。

 

Html. RouteLink():

Aspx代码  
  1. <%=Html. RouteLink("会员专区","Member",new{type="default"},new{@class="back"})%>
  2. 等价:
  3. <a class="back" href="http://www.mamicode.com/Member/?type=default">会员专区</a>

 

 

Html. BeginForm():

该方法主要用来产生<form>标签,你可以通过using语法来使用它,也可以配合Html.EndForm()辅助方法产生适当的</from>窗口结尾标签。注意这里使用是<%%>里千万不能加等号。

 

Html. TextBox():

<%=Html. TextBox("name")%>等价于<input id="name" name="name" type="text" value=""/>由此可知,我们指定了name字段的名称,通过HTML辅助方法产出HTML代码的同时,会同时将id字段赋予和Name字段一样的值。

<%=Html. TextBox("name","value")%>等价于<input id="name" name="name" type="text" http://www.mamicode.com/http://www.mamicode.com/value="value"/>注意这里的value不能写“”

<%=Html. TextBox("name","value",new{id="testId"})%> 等价于<input id="testId" name="name" type="text" http://www.mamicode.com/http://www.mamicode.com/value="value"/>值得注意的是HTML属性的Class是保留字,当需要设定Class是,需要加上“@”来跳脱

<%=Html. TextBox("name","value",new{id="testId",@class="testClass"})%>

 

还可以使用IDictionary<stirng object>接口,此重载在同一个页面中有许多HTML标签需要用到相同的的Class或Style等属性时使用。使用此重载需要现在Controller中建立一个Dictionary对象,并且使用ViewData转到View

 

C#代码  
  1. public ActionResult HelperSample(){
  2. IDictionary<string,object> attr = new Dictionary<string,object>();
  3. attr.Add("siez","32");
  4. attr.Add("style","color:red");
  5. ViewData["Dictionary"]=attr;
  6. return View();
  7. }

 

<%=Html. TextBox("name","value",ViewData["Dictionary"] as IDictionary<string,object>)%>

 

<%=Html.HttpMethodOverride("HttpVerbs.Delete")%>用来是的MVC支持REST协议。

强类型辅助方法的命名方式皆为在原先名称的最后加上"For"

 

 

URL辅助方法:

URL辅助方法与HTML辅助方法很类似,URL辅助方法用于生成HTML代码,HTML辅助方法用于生成网址;

 

Url.Action():

 

Aspx代码  
  1. <%=Url.Action("About")%>
  2. <%=Url.Action("About",new{id=1})%>
  3. <%=Url.Action("About","Home")%>
  4. <%=Url.Action("About","Home",new{id=1})%>

 

Url.Encode():

与Server.RrlEncode()方法的用法相同。

 

Url.Content():

可用于获取绝对路径<%=Url.Content("~/image/Logo.png")%>

 

Url.RouteUrl():

可以指定使用某个Route name来生成网址

Url.Route(new{id=123}) /Home/Index/123

Url.Route("root") /root/Home/Index

Url.Route("root",new{id=123}) /root/Home/Index/123

Url.Route("root",new{id=123},"https") https://localhost/root/Home/Index/123

 

Ajax辅助方法:

使用Ajax辅助方法时,必须在页面或MasterPage中加载MicrosoftAjax.js与MicrosoftMvaAjax.js这两个js文件,而要加载顺序要正确,否则会报错。

 

最常用的辅助方法有:

Ajax.ActionLink()

Ajax.BeginForm()

而这两个辅助方法和Html.ActionLink()、Html.BeginForm大致相同,只是多了一个AjaxOptions类可以设定

 

AjaxOptions属性名称

 

Confim

单击时会弹出Comfirm对话框

HttpMethod

设定HTTP请求的方法(Get或Post)

InsertionMode

设定通过Ajax辅助方法取回数据时要如果将数据新建到UpdateTargetId属性指定的元素中,有3个方法:

InsertionMode.Replace:替代UpdateTargetId属性指定的内容

InsertionMode.InsertBefore:在UpdateTargetId属性之前插入

InsertionMode.InsertAfter:在UpdateTargetId属性之后插入

LoadingElementId

在读取尚未完成时所显示的区块

OnBegin

设置开始时要执行的JavaScript函数名称

OnComplete

设置结束时要执行的JavaScript函数名称

OnFailure

设置失败时要执行的JavaScript函数名称

OnSuccess

设置完成时要执行的JavaScript函数名称

UpdateTargetId

设定返回值要显示在哪个ID上

Url

设定Request的网址

 

以下是通过Ajax辅助方法来删除数据Demo:

Aspx代码  
  1. <%Ajax.ActionLink("Delete","Delete",new {controller="Home",id="Model.Id"},new AjaxOptions{OnSuccess="Delete",Confirm="你确定要删除么?"},HttpMethod="POST",LoadingElementId="AjaxLoad")%>
  2. <script language="javascript" type="text/javascript">
  3. function Delete(data){
  4. alert(data.get_data);
  5. }
  6. </script>

 

在Action中

C#代码  
  1. [HttpPost]
  2. public ActionResult Delete(string id){
  3. ....
  4. return content("删除成功");
  5. }

自定义HTML辅助方法:

C#代码  
  1. using System;
  2. using System.Text;
  3. using System.Web.Mvc;
  4. namespace MvcApplication1.Helpers
  5. {
  6. public static class ImgHelper
  7. {
  8. public static string Img(this HtmlHelper helper,string url,string alternateText,string title){
  9. return String.Format("<img src=http://www.mamicode.com/‘{0}‘ alt=‘{1}‘ title=‘{2}‘/>",url,alternateText,title);
  10. }
  11. }
  12. }

 

 

注意,因为我们使用了自定义的HTML辅助方法,因此,必须在View的最上方将命名空间引用进来,才能使用这个自定义的HTML辅助方法,示例如下:

<%@ Import Namespace="MvcApplication1.Helper"%>

<%=Html.Img....

 

如果写复杂的Helper类,需要拼接字符串,使用StringBuilder,但是这个类使用没有任何的弹性,所以,MVC设计了TagBuilder类,能够以对象化程度更高的方式生成HTML标签。

 

验证:

可以使用MVC内置了数据验证机制,只要搭配了ViewModel及ASP.NET 5 sp1,或者ASP.NET4.0提供的Data Annotations函数库,即可实现数据验证,同时实现客户端和服务端的验证

 

 

只要在ViewModel中多加载System.ComponentModel.DataAnnotations类,并

[Required(ErrorMessage = "当前密码不能为空!")]

[DataType(DataType.Password)]

[DisplayName("当前密码")]

public stringOldPassword { get; set; }

 

后台:

利用 ModelState.IsValid验证,我们可以判断通过数据库模型绑定进来的数据是否符合ViewModel字段验证的要求,如果验证失败,则会返回false

前台:

1、在Site.Master文件中添加三个项目内置的JavaScript文件

<scriptsrc="http://www.cnblogs.com/Scripts/MicrosoftAjax.js"type="text/javascript"></script>

<scriptsrc="http://www.cnblogs.com/Scripts/MicrosoftMvcAjax.js"type="text/javascript"></script>

<scriptsrc="http://www.cnblogs.com/Scripts/MicrosoftMvcValidation.js" type="text/javascript"></script>

2、在 <% using (Html.BeginForm()) {%>语句之前加入以下声明:

<%Html.EnableClientValidation(); %>

需要注意的是,a:如果一个页面中有两个或两个以上的窗口需要进行验证,则Html.EnableClientValidation()必须出现在Html.BeginForm()声明之前,否则验证无法执行;b:使用此种验证方式必须使用Html.BeginForm()声明窗口。

3、在每个字段上加上 <%: Html.ValidationMessageFor(model => model.Name, "", new{ Style = "color:red" })%>

以显示验证失败的错误提示

 

重复发送信息:

为了解决这样现象,可以使用PRG(Post-Redirect-Get)样式的概念,当遇到需要传送窗口数据的情况时,会先通过Http Post请求送出数据,在处理完数据之后,立即转向(Redirect)另一个网址,最后通过Http Get请求取得跳转后的页面

public ActionResult About(ViewModel model){

。。。

return RedirectToAction("Other", "Home");

如果我们希望在About接受到的ViewModel数据传递给Other视图,这时就必须使用TempData机制来传递这种只会用到"1次"的数据。

TempData是一个Dictionary对象,它与ViewData很想,但非常特殊,所有存储在TempData中的数据只能被参考一次,用过之后数据就会被清空,我们可以利用TempData的特性,将About动作接受到的ViewMode类的数据传递给Other。

在About方法中需要有

TempData["LastPostViewModel"]=model;

然后在Other中

if(TempData["LastPostViewModel"]==null){

return RedirectToAction("Index");

}

var model = (强转)TempData["LastPostViewModel"];

mvc VIEW部分介绍