900字范文,内容丰富有趣,生活中的好帮手!
900字范文 > ASP.NET MVC后台和前台页面ajax双向传递Json数据

ASP.NET MVC后台和前台页面ajax双向传递Json数据

时间:2024-06-04 15:24:59

相关推荐

ASP.NET MVC后台和前台页面ajax双向传递Json数据

MVC后台和前台页面ajax传递Json数据

前台获取后台json数据json以对象方式传递string以字符串的方式传递 后台获取前台json数据json以对象方式传递string以字符串的方式传递总结记录

前台获取后台json数据

前台通过GET方法ajax的方式获取后台数据

json以对象方式传递

后台可以直接返回json对象,注意这个arrayList如果过大,会出错,因为JsonResult之有MaxJsonLength属性,这个大家可以研究,数据量大才会出现。

1.后台写法

public JsonResult ActionName(){//arrayList传递给前台的对象//前台可以直接接收到就是json对象,无需反序列 //返回一个json对象return Json(arrayList, JsonRequestBehavior.AllowGet);}

2.前台写法

$.ajax({url: '/Json/ActionName',//获取数据的路径type: 'Get',dataType: 'json',//期待返回的数据类型jsonsuccess : function(data) {//data数据就是后台传来的arrayList//直接就是json对象,可以直接使用,无需再处理。}})

string以字符串的方式传递

后台返回string类型

1.后台写法

public string ActionName(){//前台接收就是字符串,需要反序列,例如://var obj = JSON.parse(str); //由JSON字符串转换为JSON对象//返回一个json字符串string json = JsonConvert.SerializeObject(list);return json;}

2.前台写法

$.ajax({url: '/Json/ActionName',//获取数据的路径type: 'Get',dataType: 'text',//期待返回的数据类型textsuccess : function(data) {//data数据就是后台传来的json//需处理过才能获取到json对象。var jsondata= JSON.parse(data); //由JSON字符串转换为JSON对象}})

后台获取前台json数据

前台通过POST方法ajax的方式将数据传递给后台

json以对象方式传递

1.前台写法

$.ajax({url: '/Json/Post',//post数据的路径type: 'Post',data: JsonData,//传递给后台的数据,是json对象})

2.后台写法

//jsonclass:自定义的类型和前台一致即可public JsonResult Post(jsonclass data){//data就是前台传递的JsonData,可以直接得到对象,无需在做处理}

string以字符串的方式传递

1.前台写法

$.ajax({url: '/Json/Post',//post数据的路径type: 'Post',data:{'mydata':JSON.stringify(data)},//传递给后台的数据})

2.后台写法

//jsonclass:自定义的类型和前台一致即可public JsonResult Post(){//data就是前台传递的JsonData,可以直接得到对象,无需在做处理var data = GetKeyValue("mydata");JavaScriptSerializer js = new JavaScriptSerializer();//jsondata后台需要使用的数据jsonclass jsondata = js.Deserialize<jsonclass>(data);}

总结记录

JSON(JavaScript Object Notation, JS 对象简谱) 是一种轻量级的数据交换格式,它是一串字符串,只不过元素会使用特定的符号标注。本质就是前后台数据交互的一种数据格式Ajax即Asynchronous Javascript And XML(异步JavaScript和XML)json数据传递关键在于前后台一致,对象传递,就无需反序列化;字符串传递的,前后台拿到数据都需要先反序列化,得到对象,在进行使用。

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。