摘要：平時(shí)公司使用的ASP.NET MVC3來開發(fā)Web項(xiàng)目，其實(shí)在ASP.NET中已經(jīng)原生的支持JSON。所以基本不需要引進(jìn)Newtonsoft.Json.dll。下面看在MVC4中，后臺生成JSON數(shù)據(jù)，前端使用Ajax調(diào)用。然后就是前端使用POST請求，發(fā)送JSON格式，后臺程序來處理。1.后臺生成JSON格式數(shù)據(jù)，前端使用Ajax調(diào)用后臺代碼:public JsonResult&nbs

平時(shí)公司使用的ASP.NET MVC3來開發(fā)Web項(xiàng)目，其實(shí)在ASP.NET中已經(jīng)原生的支持JSON。所以基本不需要引進(jìn)Newtonsoft.Json.dll。下面看在MVC4中，后臺生成JSON數(shù)據(jù)，前端使用Ajax調(diào)用。然后就是前端使用POST請求，發(fā)送JSON格式，后臺程序來處理。

1.后臺生成JSON格式數(shù)據(jù)，前端使用Ajax調(diào)用

后臺代碼:

public JsonResult GetList()
        {
            ArrayList eventlist = new ArrayList();            for (int i = 0; i < 3; i++)
            {
                Hashtable ht = new Hashtable();
                ht.Add("eventid", i + 1);
                ht.Add("eventname", "測試活動");
                ht.Add("eventdata", "2014-04-02");
                ht.Add("eventlocation", "公司");
                eventlist.Add(ht);
            }            return Json(new { list = eventlist, count = eventlist.Count }, JsonRequestBehavior.AllowGet);
        }

 前端調(diào)用代碼：

$.ajax({
            url: "/Home/GetList",
            success: function (data) {                var eventlist =data.list;                for(var index in eventlist){
                    console.log(eventlist[index].eventname);
                }
                console.log(data.count);
            }
        });

2.前端使用POST請求，發(fā)送JSON格式數(shù)據(jù)給后臺

 頁面放置一個(gè)button，代碼片段為：<input type="button" id="btn_send" value="Send" />

$("#btn_send").click(function () {            var person1 = new Object();
            person1.Name = "Superman";
            person1.Age = 20;            var person2 = new Object();
            person2.Name = "BBB";
            person2.Age = 22;            var arr = [];
            arr.push(person1);
            arr.push(person2);
            $.ajax({
                url: '/Home/AddUser',
                type: "POST",
                data: JSON.stringify(arr),
                success: function (data) {
                    console.log(data);
                }
            });
        });

后臺代碼： 

[HttpPost]        public JsonResult AddUser()
        {            string json = string.Empty;            using(var reader=new StreamReader(HttpContext.Request.InputStream))
            {
                json = reader.ReadToEnd();
            }            bool result = false;            string message = string.Empty;            var personlist = new JavaScriptSerializer().Deserialize<List<Person>>(json);            foreach(Person p in personlist){
                result = true;
                message += p.Name + ":" + p.Age;
            }            return Json(new { result=result,message=message});
        }        public class Person
        {            public string Name { get; set; }            public int Age { get; set; }
        }

 很多人會問我，使用了MVC3，為什么不在前端使用Model，然后綁定數(shù)據(jù)，這樣后臺處理方便，而已編輯的時(shí)候，前端基本不要做什么事情。其實(shí)這樣考慮是為了把前端和后臺完全分離出來，前端使用AngularJS做數(shù)據(jù)的綁定。前端和后臺數(shù)據(jù)的傳輸格式就使用JSON。后面我們會研究ASP.NET Web API如何做到前端和后臺完全分離的。