标签:blog http io ar os sp java for 文件
Html.BeginForm与Ajax.BeginForm都是MVC架构中的表单元素,它们从字面上可以看到区别,即Html.BeginForm是普通的表单提交,而Ajax.BeginForm是支持异步的表单提交,这对于我们开发者来说是一个福音,我们不用再自己去用JQ代码了,直接用MVC自代的Ajax.BeginForm就可以很容易的完成一个异步的表单提交动作。
1 @using (Html.BeginForm()) {} //提交到当前页面 2 3 @using (Html.BeginForm(new {} )) {} //提交到当前页面,并可以传递参数 4 5 @using (Html.BeginForm("action","controller")) {} //提交到指定controller下的action中 6 7 @using (Html.BeginForm("action","controller",FormMethod.POST)) {} //提交到指定controller下的action中,并指定提交方式 8 9 FormMethod枚举如下: 10 11 // 摘要: 12 // 枚举窗体的 HTTP 请求类型。 13 public enum FormMethod 14 { 15 // 摘要: 16 // 指定 GET 请求。 17 Get = 0, 18 // 19 // 摘要: 20 // 指定 POST 请求。 21 Post = 1, 22 }
1 @using (Ajax.BeginForm( 2 new AjaxOptions 3 { 4 UpdateTargetId = "UserLogOnContainer", 5 HttpMethod = "Post", 6 OnSuccess = " ", 7 })){} //提交到当前页面,提交方式为Post,异步更新模块ID为UserLogOnContainer 8 9 @using (Ajax.BeginForm("action", "controller", null, 10 new AjaxOptions 11 { 12 UpdateTargetId = "UserLogOnContainer", 13 HttpMethod = "Post", 14 OnSuccess = " ", 15 })) 16 {} //提交到指定controller下的action,提交方式为Post,异步更新模块ID为UserLogOnContainer
View代码:
1 @model TsingDa.Ask.Models.UserLogOnModel 2 @{Layout = "";} 3 <script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script> 4 <script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script> 5 <script src="@Url.Content("~/Scripts/jquery.unobtrusive-ajax.min.js")" type="text/javascript"></script> 6 <div id="UserLogOnContainer"> 7 @using (Ajax.BeginForm("UserLogOn", "Home", null, 8 new AjaxOptions 9 { 10 UpdateTargetId = "UserLogOnContainer", 11 HttpMethod = "Post", 12 OnSuccess = " ", 13 })) 14 { 15 @Html.ValidationSummary(true) 16 <div class="editor-field"> 17 @Html.TextBoxFor(m => m.Email) 18 @Html.ValidationMessageFor(m => m.Email) 19 </div> 20 <div class="editor-field"> 21 @Html.TextBoxFor(m => m.Password) 22 @Html.ValidationMessageFor(m => m.Password) 23 </div> 24 <input type="submit" id="logOnBtn" value="登陆" /> 25 } 26 </div>
Controller层代码如下:
1 /// <summary> 2 /// 用户登陆 3 /// </summary> 4 /// <returns></returns> 5 public ActionResult UserLogOn() 6 { 7 return View(new UserLogOnModel("邮箱", "密码")); 8 } 9 [HttpPost] 10 public ActionResult UserLogOn(UserLogOnModel entity) 11 { 12 if (ModelState.IsValid) 13 { 14 VM = user_InfoManager.UserLogOn(new User_Info { Email = entity.Email, Password = entity.Password }); 15 if (VM.IsComplete) 16 { 17 return RedirectToAction("Index", "Home"); 18 } 19 else 20 { 21 VM.ToList().ForEach(i => ModelState.AddModelError("", i)); 22 } 23 } 24 25 return View(); 26 }
表单提交后,页面效果如下:
需要注意的是,表单中的按钮在异步表单中也是Submit类型,如果是异步表单,引入的JS文件需要有jquery.unobtrusive-ajax.min.js,在这项目的scripts目录已经存在。
Reference from : http://www.cnblogs.com/lori/archive/2012/06/27/2565470.html
爱上MVC3系列~Html.BeginForm与Ajax.BeginForm
标签:blog http io ar os sp java for 文件
原文地址:http://www.cnblogs.com/zhangchenliang/p/4114849.html