如何使用json在前后台进行数据传输

本文介绍了一种使用JSON格式实现前后端数据交互的方法,包括从前端生成JSON数据并发送到后端,以及将后端数据库中的数据转换为JSON格式并在前端展示。

上一篇博客写到用javascript生成多组文本,可以让数据的输入不受显示,现在我们需要把这些输入写入数据库,这里就用到json传入。

首先,我们来写一下后台如何生成要传输的数据

 

function  generateDtb() {
 //写入
        var txtName = document.getElementById("txtName").value;
        //创建数组
        var dtb = new Array();
        //通过循环把数据写入到数组并返回
        for (var i = 0; i < firstGroup.length; i++) {

            var row = new Object();
            row.Name = txtName;
            row.fullMoney = firstGroup[i].value;
            row.discount = secondGroup[i].value;
            dtb.push(row);
        }
        return dtb;
    }


 

把数组转换成json串传入到后台:

$(function () {
            //点击botton1 
            $("#lbtnOK").click(function () {
                var url = "DiscountManger.aspx?ajax=1";
                var dtb = generateDtb();
               // var strName = document.getElementById("txtName").value;
                
                if (dtb == null)
                {  }
                else {
                    //序列化对象 
                    var postdata = JSON.stringify(dtb);
                    //异步请求 
                    $.post(url, { json: postdata }, function (json) {
                        if (json) {
                            jBox.tip("添加成功!", "提示");
                            location.reload();
                        }
                        else {
                            jBox.tip("添加失败!", "提示");
                            location.reload();
                        }
                    }, "json")

                    
                }
            });
        });


 

在后台的操作:

首先判断是否需要传输数据

 

if (!IsPostBack)
                {
                    //判断是否异步请求 
                    if (Request.QueryString["ajax"] == "1")
                    {
                        ProcessRequest();
                    }


 

在这里进行对数据的处理:

/// <summary> 
        /// 处理异步请求 
        /// </summary> 
        private void ProcessRequest()
        {
            //存入要填写的策略
            ArrayList arrDiscount = new ArrayList();
            Response.ContentType = "text/html";
            string json = Request.Form["json"];
            //反序列化DataTable 
            if (json == null)
            {
                return;
            }
            else
            {
                DataTable newdtb = Json2Dtb(json);
                for (int i = 0; i < newdtb.Rows.Count; i++)
                {
                    Entity.StrategyDiscount enStrategyDiscount = new Entity.StrategyDiscount();
                    //打折方案名
                    enStrategyDiscount.name = newdtb.Rows[i]["Name"].ToString();
                    //商店ID
                    enStrategyDiscount.shopId = long.Parse(LoginInfo.ShopID);

                    enStrategyDiscount.fullMoney = Convert.ToDecimal(newdtb.Rows[i]["fullMoney"].ToString());
                    enStrategyDiscount.discount = Convert.ToDecimal(newdtb.Rows[i]["discount"].ToString());
                    //写入数据到数组
                    arrDiscount.Add(enStrategyDiscount);
                }
                //写入数据到数据库
                IStrategyBLL strategy = new StrategyBLL();

                if (strategy.AddStrategyDiscount(arrDiscount))
                {
                    Response.Write("true");
                    Response.End();
                }
                else
                {
                    Response.Write("false");
                    Response.End();
                }
               
               


            }


 

这里,我们需要把json转换成datatable

 /// <summary> 
        /// Json转DataTable 
        /// </summary> 
        /// <param name="json"></param> 
        /// <returns></returns> 
        private DataTable Json2Dtb(string json)
        {
         
                JavaScriptSerializer jss = new JavaScriptSerializer();
                ArrayList dic = jss.Deserialize<ArrayList>(json);
                DataTable dtb = new DataTable();
                if (dic.Count > 0)
                {
                    foreach (Dictionary<string, object> drow in dic)
                    {
                        if (dtb.Columns.Count == 0)
                        {
                            foreach (string key in drow.Keys)
                            {
                                dtb.Columns.Add(key, drow[key].GetType());
                            }
                        }
                        DataRow row = dtb.NewRow();
                        foreach (string key in drow.Keys)
                        {
                            row[key] = drow[key];
                        }
                        dtb.Rows.Add(row);
                    }
                }
            
            return dtb;
        }


 

这样,就可以把数据无刷新的写入到数据库。

当然,如果我们有一个从数据库读取的datatable,如果通过json显示在前台呢。

首先,我们需要把datatable转换为json数据

 

/// <summary> 
        /// DataTable转Json 
        /// </summary> 
        /// <param name="dtb"></param> 
        /// <returns></returns> 
        private string Dtb2Json(DataTable dtb)
        {
            JavaScriptSerializer jss = new JavaScriptSerializer();
            ArrayList dic = new ArrayList();
            foreach (DataRow row in dtb.Rows)
            {
                Dictionary<string, object> drow = new Dictionary<string, object>();
                foreach (DataColumn col in dtb.Columns)
                {
                    drow.Add(col.ColumnName, row[col.ColumnName]);
                }
                dic.Add(drow);
            }
            return jss.Serialize(dic);
        }


 

然后写回到前台

 

        /// <summary> 
        /// 处理异步请求 
        /// </summary> 
        private void ProcessRequest()
        {
            Response.ContentType = "text/html";
            string json = Request.Form["json"];
            //反序列化DataTable 
            DataTable newdtb = Json2Dtb(json);
            //序列化DataTable为JSON 
            string back = Dtb2Json(newdtb);
            Response.Write(back);
            Response.End();
        }

在前台接受显示:

 

$(function() { 
            //点击botton1 
            $("#botton1").click(function() { 
                    createTable(json); 
              }); 
        });

     //显示Json中的数据 
        function createTable(json) { 
            var table = $("<table border='1'></table>"); 
            for (var i = 0; i < json.length; i++) { 
                o1 = json[i]; 
                var row = $("<tr></tr>"); 
                for (key in o1) { 
                    var td = $("<td></td>"); 
                    td.text(o1[key].toString()); 
                    td.appendTo(row); 
                } 
                row.appendTo(table); 
            } 
            table.appendTo($("#back")); 
        }


 

这样,就完成了json向后台传输数据和显示后台数据了,当然,这种传输方式只是传输的一种,如果是简单的字符串也可以用get和post进行传输,但是,javascript本身具有不安全性和不稳定行,对于一些比较重要的数据,建议还是寻找一些更可靠的方法。

 

评论 3
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值