失眠网,内容丰富有趣,生活中的好帮手!
失眠网 > 浅析Asp.net MVC 中Ajax的使用

浅析Asp.net MVC 中Ajax的使用

时间:2023-12-29 15:32:48

相关推荐

浅析Asp.net MVC 中Ajax的使用

在 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而已。

如对本文有疑问,请提交到交流社区,广大热心网友会为你解答!! 点击进入社区

您可能感兴趣的文章:

jQuery使用ajaxSubmit()提交表单示例jquery中ajax使用error调试错误的方法基于jquery的$.ajax async使用jquery.ajax之beforeSend方法使用介绍使用jquery的ajax需要注意的地方dataType的设置jquery序列化form表单使用ajax提交后处理返回的json数据跨域请求之jQuery的ajax jsonp的使用解惑Ajax的使用代码解析Ajax的使用四大步骤AJAX的使用方法详解 /article/72660.htm

如果觉得《浅析Asp.net MVC 中Ajax的使用》对你有帮助,请点赞、收藏,并留下你的观点哦!

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。