Json With Jquery MVC3

大家好，

我看到论坛里很多人都知道 Json，但也有很多人刚开始接触它，所以我创建了一个简单的示例，展示了 Json 的工作原理，而且不仅仅是这样，通过这个示例，你可以看到 MVC3 默认提供的模型绑定器（Model Binder）是如何工作的，而在 MVC2 中，我们需要做一些额外的事情。

对于这个示例，你需要添加由 Douglas Crockford 创建的 Json2 库。

视图 (Jquery):

<script src="../../Scripts/json2.js" type="text/javascript"></script> 

 

<input type="button" onclick="javascript:JsonInAction()" value="Json" />

<div id="JsonResponse"></div>

<script language="javascript" type="text/javascript"> 

vardata = [{"lastName": "Orue", "firstName": "Esteban", "phones": [{ "type": "Mobile", "number": "(011) 4121-2121" },

{ "type": "Home", "number": "(011) 4123-4567"}]

},

{ "firstName": "Alejandro", "lastName": "Orue", "phones": [{ "type": "Mobile", "number": "(011) 4121-7777" },

{ "type": "Home", "number": "(011) 4121-9999"}]}];

 

functionJsonInAction() {

   $.ajax({

    url'/Home/CollectJsonData',

    data: JSON.stringify(data),

    type'POST',

    contentType'application/json; charset=utf-8',

    dataType'json',

    successfunction(result) {

     vardivInsert = document.getElementById("JsonResponse");

     divInsert.innerHTML = result;

    },

    errorfunction () {  

   alert("error");

    }

   });

}

控制器 (Controller)

 public ActionResultCollectJsonData(列表<人员> person)

{

   returnJson(data: person[0].firstName.ToString());

}

模型

 public 类 人员

{

   public 字符串firstName {get; set; }

   public 字符串lastName {get; set; }

   public 列表<电话> phones {get; set; }

}

 public 类 电话

{

   public 字符串type {get; set; }

   public 字符串number {get; set; }

}

注意：在 ActionResult 中添加一个断点，你会看到有 2 个 Person，这就是模型绑定器的神奇之处，MVC3 通过模型绑定器知道你有一个 Person 类，并且在 post 请求中发送了 2 个 Person。

希望对你有帮助！

编码愉快，朋友们！！