如何在ASP.NET MVC中使用ajax-优快云博客

由于原生ajax写起来比较麻烦，我未来省事就用的jquery的库。

HTML代码如下:

@{
    Layout = null;
}

<!DOCTYPE html>

<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>Index</title>
    <script src="~/Scripts/jquery-1.10.2.js"></script>
</head>
<body>
    <div>
        <button id="request"  type="button">1111</button>
    </div>
    <script>
        $(function () {

            $("#request").click(function () {

                $.ajax({
                    url: "/ajaxdemo/getData",
                    type:'post',
                    dataType: "json",
                    data: {
                        id: 10,
                        iCode: 1
                    },//传递给后台的值
                    success: function (data) {
                        console.log(data.iCode);
                    }
                });
            })
        })
    </script>
</body>
</html>

控制器中的代码如下:

using System.Web.Mvc;

namespace AngularJSandMVC.Controllers
{
    public class AjaxDemoController : Controller
    {
        // GET: AjaxDemo
        public ActionResult Index()
        {
            return View();
        }
        public ActionResult GetData(int id, int iCode)//用于接受前台传过来的值
        {
            return Json(new { Id=id,iCode=iCode});
        }
    }
}

在GetData方法中，接受两个参数，其实就是在前台传递过来的值，这是一种简单的写法，还可以写成 Request.Form["id"]，这就看个人的喜好了。在返回的时候，

return Json(object,JsonRequestBehavior.AllowGet),第二个参数为可选参数。这里Json是ActionResult的子类，这儿运用了多态。然后我们把视角切换回前台的回调函数，data就是返回的数据，回调函数可以有多个参数，我这儿写的是最简单的，其余的用法，w3也有demo。然后我们就可以进行相应的DOM操作实现页面的部分刷新。