ajax 辅助方法区别,Ajax辅助方法

利用ajax技术可以帮助网站减少切换页面的机会，加快网速响应速度，降低网络下载流量，也能让用户经验更好。aspnet mvc中内建了ajax的辅助方法，可以方便快速的做到许多ajax互动效果。

在使用ajax之前，要在页面先载入jq以及mvc4.0专案模板内附的jquery.unobtrusive-ajax.js文件才能正常执行，

为了让网站载入适当的js函数库，必须现在Layout页面载入适当的js文件，事实上在mvc4..0的网际网路专案模板中已经在_Layout.cshtml页面上加入了jq载入，可以开启主版页面的最下方看到

@Scripts.Render("~/bundles/jquery")

@RenderSection("scripts",required:false)

第一句的意思就是载入专案里的jquery-1.7.1.js文件，因为ajax功能并不是每一页都需要使用，所以预设并没有载入，[email protected]ery.unobtrusive-ajax.js文件

如果需要在页面中使用ajax辅助方法

@section scripts{

}

使用ajax超链接功能

ajax辅助方法会比html辅助方法多出一个AjaxOptions类型的参数，用来控制Ajax执行时的各种参数，

public ActionResult GetTime(){

return Content(Datetime.Now.ToString(F""))

}

@Html.ActionLink("取得目前时间"，“GetTime”)

输出

取得目前时间标签a>

当这个超链接被点击后，会链接到另一个/Home/GetTime页面，如果希望改用ajax的方式动态地将/Home/GetTime网页的执行结果回传到目前网页的其中一个div里，那么可以这样改写

@Ajax.ActionLink("取得目前时间"，“GetTime”,new AjaxOptions{UpdateTargetId = "now"})

标签div>

输出

取得目前时间标签a>

标签div>

开启网页之后，点击这个超链接，浏览器便会自动取得/Home/GetTime网页的完整内容，并填入now的div块中。

注意：

通过ajax远端取得网页内容的过程中，浏览器会为了让执行效率提升，会预设通过ajax取得的网页内容只要ajax调用网址没有改变，且远端的http没有包含缓存相关标头，那么浏览器不会再次发出ajax要求，以刚刚的为例。，当第一次点击取得时会回传当下的服务器时间，当第二次点选同一个网址，案例应该看到更新的时间才对，但是结果却永远没法更新，除非清空浏览器缓存，

如果需要ajax回传的数据必须及时更新，那么就必须调整你的Action方法定义，新增一个OutputCache属性，强迫浏览器不要缓存这一页的要求

[OutputCache(NoStore=true,Duration=0)]

public ActionResult GetTime(){

return Content(Datetime.Now.ToString(F""))

}

使用ajax表单功能

比如原本是

@using(Html.BeginForm()){

若要改成ajax

@using(Ajax.BeginForm(newAjaxOptions{ UpdateTargetId="now"}))

@Ajax.ActionLink执行流程

1，用户单点击超链接

2，对超链接上的href属性定义的Action网址发出HTTP要求

3，取回内容后再将内容填入AjaxOptions物件的UpdateTargetId属性所指定的id元素中

@Ajax.BeginForm执行流程

1，用户送出表单

2，对表单元素上的action属性的Action网址发出http要求，并将表单所有数据传过去，

3，取回内容后再将内容填入ajaxOptions物件的UpdateTargetId属性所指定的id元素中。

了解AjaxOptions类型

无论使用Ajax.ActionLink 或者Ajax.BeginForm，都需要传入AjaxOptions的物件当参数，这个参数将决定asp.net mvc的ajax如何运作。

AjaxOptions属性名称

Confirm执行ajax之前会跳出一个确认对话框

HttpMethod设定http的设定方法

InsertionMode设定通过Ajax的辅助方法取回数据时，要如何将数据新增至UpfateTargetId(缩写为UTI)指定的元素中，有以下三种：

InsertionMOde.Replace:取代UTI的内容(预设)

InsertionMOde.InsertBefore:在UTI之前插入

InsertionMOde.InsertAfter 在UTI之后插入

LoadingElementId 在ajax尚未完成所有工作前显示的元素id值

OnBegin设定开始时要执行的js函数名称

OnComplete设定结束时要执行的js函数名称

OnFailure设定失败时执行的

OnSuccess 设定完成时要执行的js函数名称

UpdateTargetId设定回传值要显示在哪一个id上

URL 设定ajax的请求网址

当使用OnBegin，OnComplete，OnFailure，OnSuccess 这四个属性时，如果指定的函数名称不存在网页中，就会发生js错误

实例：

@Ajax.ActionLink("删除数据"，“GetTime”,new {controller="Home",id=3,new AjaxOptions{OnSuccess="Delete" ,Confirm="您确定要删除吗？", HttpMethod="POST",LoadingElementId="ajaxLoad"}})

<标签script标签>

function Delete(data){

alert(data);

}

标签script标签>

原文：http://www.cnblogs.com/jinhaoObject/p/4597703.html