MVC中view与controller传json数据

来源:互联网 发布:ubuntu安装exe 编辑:程序博客网 时间:2024/06/06 19:56

在mvc框架中,不可避免地会遇到前台传值到后台,前台接收后台的值的情况(前台指view,后台指controller),既然要多次使用,就要好好总结,这样不仅自己能记住这些传值的方式和语法,也可能会帮到一些新手。下面开始。

准备工作
测试用的类的定义

    /// <summary>    /// 测试用的Person类,注意要用public,以及访问器get;set    /// </summary>    public class Person    {        public string name { get; set; }        public string sex { get; set; }        public string phone { get; set; }        public Person(string n,string s, string p)        {            name = n;            sex = s;            phone = p;        }    }

请注意,这里的类的成员访问级别要设置为public,并且要设置访问器。当然不出现在传送中的成员就随便了。
引入命名空间

using Newtonsoft.Json;

以下分三种情况来介绍传值方式
一、页面载入时就接收json数据(不需用户触发)
controller的代码:

public ActionResult Index()        {            Person myPerson = new Person("李四", "女", "13888888");            ViewData["Person"] = JsonConvert.SerializeObject(myPerson);            return View();        }

html的代码:
body部分

<h1>view不发送请求,view载入时直接接收json</h1>    <input id="hdData" type="hidden" value="@ViewData["Person"]"/>    <button id="send0">显示</button>

scrip部分

$("#send0").click(function(){        var jsonString = $("#hdData").val();        var json = eval('(' + jsonString + ')');        //设置断点,查看json变量的值        alert(json.name);    })

首先在controller中,用JsonConvert.SerializeObject(string)方法,将类的实体转化为json字符串,再把他装到ViewData[“Person”]中,view中通过input标签的value=”@ViewData[“Person”]”来取得。接着访问input标签,用jq选择器取到input标签的value,最后调用evel方法,把字符串转化为object

二、view传json数据到controller
html代码

$("#send").click(function () {        var person = {            name: "张三",            sex: "男",            phone: "135666"        }        $.ajax({            url: "/Home/ReciveJsonData",            type: "post",            data: { jdata: JSON.stringify(person) },            success: function () {                alert("发送成功!")            },            error: function () {                alert("发送失败!")            }        })    })

这里要注意,确保你的url是正确的,格式为/controller名字(但不需要controller单词)/方法名;type设置为post,data:jdata要与controller方法的参数名一致,必须调用JSON.stringify方法把object转化为json字符串。
controller的代码

public void ReciveJsonData(string jdata)        {            Person myPerson = JsonConvert.DeserializeObject<Person>(jdata);        }

使用JsonConvert.DeserializeObject<类名>(字符串)来把传过来的字符串解析为对应的类
运行结果
这里写图片描述

三、view发送请求到服务器,再接收json数据
html代码

$("#send1").click(function () {        $.ajax({            url: "Home/SendJsonData",            type: "get",            dataType: "json",            success: function (data) {                alert(data.name);                //设置断点,查看data的值            },            error: function (e) {                alert("错误!");            }        })    })

收到的data,不需要解析,直接就是object类。
如图所示
这里写图片描述

controller代码

public string SendJsonData()        {                        Person myPerson = new Person("李四", "女", "13888888");            string jResult = JsonConvert.SerializeObject(myPerson);            return jResult;        }

注意,方法的返回类型为string,要把类转化为json字符串再传回view。

总结:总的来说,传送的数据只能是string类型(或许有其他方式,但是其他方式经常出错),无论是view传给controller还是反过来,传送之前要转化为json字符串,传送后要对结果进行解析,才能得到我们要的类。
完整代码之后会发上来。

0 0
原创粉丝点击
热门问题 老师的惩罚 人脸识别 我在镇武司摸鱼那些年 重生之率土为王 我在大康的咸鱼生活 盘龙之生命进化 天生仙种 凡人之先天五行 春回大明朝 姑娘不必设防,我是瞎子 天猫过敏无忧不给退款怎么办 顺丰快递指定丰巢柜发现柜满怎么办 阿里购物申请退款过期末退怎么办 韵达签收了发现里面东西丢了怎么办 没有收到快递但是显示签收了怎么办 支付宝充话费显示商家未发货怎么办 快递被买家签收后调包了怎么办 快递买家签收了东西坏了怎么办 快递没签收到买家评价了怎么办 快递买家签收后现在要退货怎么办 支付宝充话费充错对方关机怎么办 闲鱼同意退款了买家不退东西怎么办 被骗了说给存q币怎么办 方正说我的淘宝字体侵权怎么办 买家说收到衣服没有吊牌该怎么办 淘宝下完订单店主不发货怎么办 工商局不给查被告企业的信息怎么办 被职业打假人起诉到法院怎么办 京东购物如果换货不给你发货怎么办 淘宝上发的快递没有了怎么办 天猫购物半个月不发货怎么办 京东网同一产品购买多规格的怎么办 天猫商城购买的家具要退换货怎么办 亚马逊美国站会员日前没销量怎么办 淘宝买的鞋子把脚磨坏了怎么办 拼多多下单 没货 没法发货怎么办 闲鱼退货物流弄坏了卖家拒收怎么办 客户说物流太慢了 要退货怎么办 京东退货物流系统不更新怎么办 把货交给物流但是物流丢货了怎么办 货还在物流就申请退款怎么办 荣耀4x返回键不管用怎么办 华为手机关不了机也开不了机怎么办 荣耀畅玩5x手机密码忘了怎么办 华为短信验证码失败其他错误怎么办 红米3x手机卡顿反应慢怎么办 华为手机不停的自动重启怎么办 华为荣耀4x卡在开机界面怎么办 华为荣耀8青春版密码忘了怎么办 华为手机内存满了开不起来怎么办 华为荣耀畅玩平板2比较卡怎么办