在 MVC beta中我们可以使用Ajax.BeginForm, Ajax.ActionLink来进行Ajax调用,同样我们也可以使用一些支持Ajax 框架如jQuery来简化对ajax的调用。
一、使用System.Web.Mvc.Ajax
1.1 System.Web.Mvc.Ajax.BeginForm
1.2 System.Web.Mvc.Ajax.ActionLink
二、手工打造自己的“非介入式”Javascript”
一、使用System.Web.Mvc.Ajax
1.1 System.Web.Mvc.Ajax.BeginForm
第一步:用Ajax.BeginForm创建Form
?
最终生成的form如下:
?
第二步:创建Ajax.BeginForm的new AjaxOptions()对象的Url指向的Action
?
注意:
关于使用System.Web.Mvc.Ajax的说明:
Controller的Action方法:
(1)当显式添加[HttpPost],传给System.Web.Mvc.Ajax的AjaxOptions()的HttpMethod只能为 "post",
(2)当显式添加[HttpGet],传给System.Web.Mvc.Ajax的AjaxOptions()的HttpMethod只能为 "get",
(3)当都没有显式添加[HttpPost]和[HttpGet],传给System.Web.Mvc.Ajax的AjaxOptions()的HttpMethod可以为 "get"也可以为"post",
第三步:添加要承载更新页面的html元素,
也就是添加添加AjaxOptionsd对象的UpdateTargetId 参数指定的Id为restaurantList的html元素:
这里在页面中添加:id为restaurantList的<div>:
?
第四步:(可选)为增强用户体验,添加AjaxOption对象的LoadingElementId参数指定的Id为loding的html元素:
?
这里在页面中添加:id为loding的元素,添加了包含一个动态的刷新图片<div>:
cshtml文件中添加:
?
1.2 System.Web.Mvc.Ajax.ActionLink
System.Web.Mvc.Ajax.ActionLink与System.Web.Mvc.Ajax.BeginForm用法基本一致
第一步:使用System.Web.Mvc.Ajax.ActionLink创建超链接
?
对应生成的最终html为:
?
第二步:定义出来响应超链接的Action:
?
第三步:定义承载更新部分的html元素:
?
第四步:(可选)为增强用户体验,添加AjaxOptionsd对象的LoadingElementId参数指定的Id为loding的html元素:
与1.1第四步相同。
二、手工打造自己的“非介入式”Javascript”
第一步:添加表单:
?
生成的form为:
?
第二步:添加处理表单的Action:
这里与1.1的第二步一样。
第三步:添加Js处理表单:
?
注意:
所谓的“非介入式Javascript”模式,是指假如没有添加这一步,表单照样能被处理,只是没用到Ajax而已。
如对本文有疑问,请提交到交流社区,广大热心网友会为你解答!! 点击进入社区