第1节. Ajax辅助方法
#NET编程#在 MVC 5中除了支持HTML辅助方法之外，还支持另外一套与Ajax相关的辅助方法，称为Ajax辅助方法。这些Ajax辅助方法是异步进行的。
MVC 5 ActionLink()方法
要想使用Ajax辅助方法，需要引入文件：jquery.unobtrusive-ajax.js，此文件是支持ajax的基础，微软的MVC 5 Ajax辅助方法是借助于jquery实现的。
Mvc 5深入编程-从0基础到深入学习 线上.NET培训课程¥178淘宝月销1购买
在创建MVC 5 Web应用程序之后，项目的根目录下会存在script的文件夹，其中就存在与jquery相关的js文件，如果需要的js文件不存在，可以通过NuGet添加。
jquery.unobtrusive-ajax.js文件如果不存在项目中，可以使用如下方法添加，右击Web项目，弹出右键菜单。
在菜单中找到“管理NuGet程序包”，以可视化的方式添加需要的组件，微软现在也是推荐大家通过NuGet添加组件，支持添加和删除，实现可插拔的方式使用第三方或自己开发的组件。
NuGet包管理器
输入需要安装组件的关键字，就可以在NuGet中查找出结果，然后使用NuGet程序包即可安装需要的功能包。
功能包安装完成之后，就可以将程序集或文件添加到需要的程序中。
一、 Ajax的ActionLink方法
对于Ajax的ActionLink()方法是一个非常重要的方法，使用该方法完全可以实现异步加载数据，也就是无刷新的数据，并且可以直接将控制器中的数据返回给视图。
@Ajax.ActionLink()方法的基本语法如下：
<div id="div1">@Ajax.ActionLink("异步加载", "SyncLoad", new AjaxOptions { UpdateTargetId = "div1", InsertionMode = InsertionMode.Replace, HttpMethod = "GET" });</div>
此代码要全部掌握牢，非常之重要，说明如下：
(1). 首先最外层的div1表示通过Ajax.ActionLink()方法将服务器端的数据异步加载到id=“div1”的div标记中。
(2). Ajax.ActionLink()方法的第一个参数表示超链接的文本信息。
(3). Ajax.ActionLink()方法的第二个参数用于指定加载数据的控制器中的操作方法名称，当然也可以在重载中指定控制器，不指定控制器，默认是当前视图所在方法的控制器。
(4). Ajax.ActionLink()方法的第三个参数是new AjaxOptions()对象，其中的参数说明如下：
A.UpdateTargetId属性表示返回的数据要更新哪那个HTML标记中，使用标记的ID指定。
B.InsertionMode属性表示从服务器返回的数据以什么样的方式添加到HTML元素中，InsertionMode.Replace表示替换。
ActionLink()方法的参数
C.HttpMethod属性表示设置的HTTP请求方式。
在控制器中编写一个简单的方法，并使用Ajax.ActionLink()方法调用，该方法是被异步加载的。
这里的SyncLoad()方法只是返加一个简单的字符串。上面的Ajax.ActionLink()方法中调用的就是SyncLoad()方法，现在运行一下结果：
运行后的页面上出现了一个超链接，该超链接点击后不会跳转页面，也不会刷新页面，是一个无刷新的页面。点击一下此链接，看一下运行结果。
当点击过链接之后，页面并没有刷新，而是通过异步的方式加载服务器的数据，将SyncLoad()方法返回的结果显示在页面上了。
二、 HTML 5特性
在具有@Ajax.ActionLink()方法的页面调用后，查看一下网页源代码，我们看看最终被翻译成了什么Html代码？
微软使用了HTML5特性完整的实现了异步加载。并且是非侵入式的，没有任何的JS代码。
三、 Ajax表单
在 MVC 5中，可以使用异步表单功能实现表单数据的无刷新提交，也就是Ajax表单。
@{Layout = null;}<!DOCTYPE html><html><head> <meta name="viewport" content="width=device-width" /> <title></title> <script src="~/Scripts/jquery-1.10.2.js"></script> <script src="~/Scripts/jquery.unobtrusive-ajax.js"></script> <script type="text/javascript"> function searchFaild() { alert("失败"); } function searchSuccess() { alert("成功"); } </script></head><body> <div> @*异步提交数据*@ @using (Ajax.BeginForm("Add", new AjaxOptions() { InsertionMode = InsertionMode.Replace, HttpMethod = "POST", OnFailure = "searchFaild", OnSuccess = "searchSuccess", LoadingElementId = "ajax-loader" })) { @Html.TextBox("q") <input type="submit" value="提交" /> <img id="ajax-loader" src="~/Content/timg.gif" style="display:none;" /> } </div></body></html>
这是一段完整的视图代码，并且将@Ajax.ActionLink()方法的参数都用上，我们来测试一下会发生什么样的效果。
从运行的结果上看，我们还添加了动画效果，由于页面没有刷新，所以我们可以放一个gif的图片，让加载具有动态性，给用户一种友好的体验。
第2节. 返回JSON
对于 MVC 5控制器中的操作方法，也是可以直接给视图返回JSON字符串的，这样在其它页面就可以使用Jquery的$.ajax()方法获取JSON数据，这里的操作方法返回的JSON字符串相当于一般处理程序ASHX返回JSON字符串来使用。
/// <summary>/// 返回JSON数据/// </summary>/// <returns></returns>[HttpGet]public JsonResult GetJSON(){InfoDev.DBHelper db = new InfoDev.DBHelper(); System.Data.DataTable dt = db.GetDataTable("select * from StudentInfo"); return Json(JsonConvert.SerializeObject(dt), JsonRequestBehavior.AllowGet);}
在控制器中，编写的返回JSON字符串的方法与其它方法是有区别的。区别如下：
(1). 返回类型是JsonResult。
(2). 将数据库返回的数据使用SerializeObject()序列化，且还要指定允许HTTP Get提交。
当在视图中使用@Ajax.ActionLink()方法调用GetJSON()方法后，返回的JSON字符串是由数组组成的原始字符串，不容易理解，需要进一步的处理获取有用的数据。
在其它的任何平台上可以使用$.ajax()方法获取JSON数据，然后再进一步处理。如下是通过$.ajax()在html页面上调用的代码：
<script src="~/Scripts/jquery-1.10.2.js"></script><script type="text/javascript">function GetJSONData() { var div1 = $("#div1"); var d = $.ajax({ url: "/Student/GetJSON", type: "Get", dataType: "JSON", success: function (data, status, xhr) {console.log(data); } }) }</script>
此段代码是使用了jQuery的ajax技术获取GetJSON()方法中返回的JSON字符串，得到结果后，可以进一步的处理，将需要的数据遍历出来，并显示在页面上或再提交给其它服务器处理。
