首页 > 代码库 > mvc VIEW部分介绍
mvc VIEW部分介绍
因为如果在view页面中的路径直接写死为<from action="/Home/Save" method="post">那么当Global.asax.cs文件中的Routing自定义或随时修改后,还要连带修改数十个视图中的窗口发送路径.
在MVC中,我们可以使用Html.BeginForm()
- <%
- using (Html.BeginForm("Save","Home",FormMethod.Post)){
- %>
- 窗口内容
- <%}%>
或
- <%
- using (Html.BeginForm("Save","Home")){
- %>
- 窗口内容
- <%}%>
如果窗口送出的对象是同一个Action,那么可以简写为
- <%
- using (Html.BeginForm()){
- %>
- 窗口内容
- <%}%>
因为送出窗口的对象与当前视图所在的Controller相同,只是Action不同,所以可以通过View的RouteData.Values对象获取当前的所有路由值,并动态加载路由值中的Controller的名称
RouteData.Values
- <%
- using (Html.BeginForm(("Save",RouteData.Values["controller"].ToString())){
- %>
- 窗口内容
- <%}%>
使用 <%: 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():
- <%=Html. ActionLink("超链接文字","actionName")%>
- <%=Html. ActionLink("超链接文字","actionName","controllerName")%>
- <%=Html. ActionLink("超链接文字","actionName","controllerName",new{id=123,page=5})%>
在使用Html. ActionLink()时,超链接文本处不可以输入空白或“null”值,否则会抛“The Value cannot be null or emtty”的异常。
Html. RouteLink():
- <%=Html. RouteLink("会员专区","Member",new{type="default"},new{@class="back"})%>
- 等价:
- <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
- public ActionResult HelperSample(){
- IDictionary<string,object> attr = new Dictionary<string,object>();
- attr.Add("siez","32");
- attr.Add("style","color:red");
- ViewData["Dictionary"]=attr;
- return View();
- }
<%=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():
- <%=Url.Action("About")%>
- <%=Url.Action("About",new{id=1})%>
- <%=Url.Action("About","Home")%>
- <%=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:
- <%Ajax.ActionLink("Delete","Delete",new {controller="Home",id="Model.Id"},new AjaxOptions{OnSuccess="Delete",Confirm="你确定要删除么?"},HttpMethod="POST",LoadingElementId="AjaxLoad")%>
- <script language="javascript" type="text/javascript">
- function Delete(data){
- alert(data.get_data);
- }
- </script>
在Action中
- [HttpPost]
- public ActionResult Delete(string id){
- ....
- return content("删除成功");
- }
自定义HTML辅助方法:
- using System;
- using System.Text;
- using System.Web.Mvc;
- namespace MvcApplication1.Helpers
- {
- public static class ImgHelper
- {
- public static string Img(this HtmlHelper helper,string url,string alternateText,string title){
- return String.Format("<img src=http://www.mamicode.com/‘{0}‘ alt=‘{1}‘ title=‘{2}‘/>",url,alternateText,title);
- }
- }
- }
注意,因为我们使用了自定义的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部分介绍