MVC中view与controller传json数据
在mvc框架中,不可避免地会遇到前台传值到后台,前台接收后台的值的情况(前台指view,后台指controller),既然要多次使用
测试用的类的定义
1 /// <summary> 2 /// 测试用的Person类,注意要用public,以及访问器get;set 3 /// </summary> 4 public class Person 5 { 6 public string name { get; set; } 7 public string sex { get; set; } 8 public string phone { get; set; } 9 public Person(string n,string s, string p) 10 { 11 name = n; 12 sex = s; 13 phone = p; 14 } 15 }
请注意,这里的类的成员访问级别要设置为public,并且要设置访问器。当然不出现在传送中的成员就随便了。
引入命名空间
using Newtonsoft.Json;
以下分三种情况来介绍传值方式
一、页面载入时就接收json数据(不需用户触发)
controller的代码:
1 public ActionResult Index() 2 { 3 Person myPerson = new Person("李四", "女", "13888888"); 4 ViewData["Person"] = JsonConvert.SerializeObject(myPerson); 5 return View(); 6 }
html的代码:
body部分
1 <h1>view不发送请求,view载入时直接接收json</h1> 2 <input id="hdData" type="hidden" value="@ViewData["Person"]"/> 3 <button id="send0">显示</button>
scrip部分
1 $("#send0").click(function(){ 2 var jsonString = $("#hdData").val(); 3 var json = eval('(' + jsonString + ')'); 4 //设置断点,查看json变量的值 5 alert(json.name); 6 })
首先在controller中,用JsonConvert.SerializeObject(string)方法,将类的实体转化为json字符串,再把他装到ViewData[“Person”]中,view中通过input标签的value=”@ViewData[“Person”]”来取得。接着访问input标签,用jq选择器取到input标签的value,最后调用evel方法,把字符串转化为object。
二、view传json数据到controller
html代码
1 $("#send").click(function () { 2 var person = { 3 name: "张三", 4 sex: "男", 5 phone: "135666" 6 } 7 $.ajax({ 8 url: "/Home/ReciveJsonData", 9 type: "post", 10 data: { jdata: JSON.stringify(person) }, 11 success: function () { 12 alert("发送成功!") 13 }, 14 error: function () { 15 alert("发送失败!") 16 } 17 }) 18 })
这里要注意,确保你的url是正确的,格式为/controller名字(但不需要controller单词)/方法名;type设置为post,data:jdata要与controller方法的参数名一致,必须调用JSON.stringify方法把object转化为json字符串。
controller的代码
1 public void ReciveJsonData(string jdata) 2 { 3 Person myPerson = JsonConvert.DeserializeObject<Person>(jdata); 4 }
使用JsonConvert.DeserializeObject<类名>(字符串)来把传过来的字符串解析为对应的类
运行结果
三、view发送请求到服务器,再接收json数据
html代码
1 $("#send1").click(function () { 2 $.ajax({ 3 url: "Home/SendJsonData", 4 type: "get", 5 dataType: "json", 6 success: function (data) { 7 alert(data.name); 8 //设置断点,查看data的值 9 }, 10 error: function (e) { 11 alert("错误!"); 12 } 13 }) 14 })
收到的data,不需要解析,直接就是object类。
如图所示
controller代码
1 public string SendJsonData() 2 { 3 Person myPerson = new Person("李四", "女", "13888888"); 4 string jResult = JsonConvert.SerializeObject(myPerson); 5 return jResult; 6 }
注意,方法的返回类型为string,要把类转化为json字符串再传回view。
总结:总的来说,传送的数据只能是string类型(或许有其他方式,但是其他方式经常出错),无论是view传给controller还是反过来,传送之前要转化为json字符串,传送后要对结果进行解析,才能得到我们要的类。