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

Biegral 2018/10/29 22:26:12 18117

转自：http://blog.csdn.net/laner0515/article/details/8784959

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

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

 

[html] view plaincopy
  1. function  generateDtb() {  
  2.  //写入  
  3.         var txtName = document.getElementById("txtName").value;  
  4.         //创建数组  
  5.         var dtb = new Array();  
  6.         //通过循环把数据写入到数组并返回  
  7.         for (var i = 0; i < firstGroup.length; i++) {  
  8.   
  9.             var row = new Object();  
  10.             row.Name = txtName;  
  11.             row.fullMoney = firstGroup[i].value;  
  12.             row.discount = secondGroup[i].value;  
  13.             dtb.push(row);  
  14.         }  
  15.         return dtb;  
  16.     }  


 

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

[html] view plaincopy
  1. $(function () {  
  2.             //点击botton1   
  3.             $("#lbtnOK").click(function () {  
  4.                 var url = "DiscountManger.aspx?ajax=1";  
  5.                 var dtb = generateDtb();  
  6.                // var strName = document.getElementById("txtName").value;  
  7.                   
  8.                 if (dtb == null)  
  9.                 {  }  
  10.                 else {  
  11.                     //序列化对象   
  12.                     var postdata = JSON.stringify(dtb);  
  13.                     //异步请求   
  14.                     $.post(url, { json: postdata }, function (json) {  
  15.                         if (json) {  
  16.                             jBox.tip("添加成功！", "提示");  
  17.                             location.reload();  
  18.                         }  
  19.                         else {  
  20.                             jBox.tip("添加失败！", "提示");  
  21.                             location.reload();  
  22.                         }  
  23.                     }, "json")  
  24.   
  25.                       
  26.                 }  
  27.             });  
  28.         });  


 

在后台的操作：

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

 

[html] view plaincopy
  1. if (!IsPostBack)  
  2.                 {  
  3.                     //判断是否异步请求   
  4.                     if (Request.QueryString["ajax"] == "1")  
  5.                     {  
  6.                         ProcessRequest();  
  7.                     }  


 

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

[html] view plaincopy
  1. /// <summary>   
  2.         /// 处理异步请求   
  3.         /// </summary>   
  4.         private void ProcessRequest()  
  5.         {  
  6.             //存入要填写的策略  
  7.             ArrayList arrDiscount = new ArrayList();  
  8.             Response.ContentType = "text/html";  
  9.             string json = Request.Form["json"];  
  10.             //反序列化DataTable   
  11.             if (json == null)  
  12.             {  
  13.                 return;  
  14.             }  
  15.             else  
  16.             {  
  17.                 DataTable newdtb = Json2Dtb(json);  
  18.                 for (int i = 0; i < newdtb.Rows.Count; i++)  
  19.                 {  
  20.                     Entity.StrategyDiscount enStrategyDiscount = new Entity.StrategyDiscount();  
  21.                     //打折方案名  
  22.                     enStrategyDiscount.name = newdtb.Rows[i]["Name"].ToString();  
  23.                     //商店ID  
  24.                     enStrategyDiscount.shopId = long.Parse(LoginInfo.ShopID);  
  25.   
  26.                     enStrategyDiscount.fullMoney = Convert.ToDecimal(newdtb.Rows[i]["fullMoney"].ToString());  
  27.                     enStrategyDiscount.discount = Convert.ToDecimal(newdtb.Rows[i]["discount"].ToString());  
  28.                     //写入数据到数组  
  29.                     arrDiscount.Add(enStrategyDiscount);  
  30.                 }  
  31.                 //写入数据到数据库  
  32.                 IStrategyBLL strategy = new StrategyBLL();  
  33.   
  34.                 if (strategy.AddStrategyDiscount(arrDiscount))  
  35.                 {  
  36.                     Response.Write("true");  
  37.                     Response.End();  
  38.                 }  
  39.                 else  
  40.                 {  
  41.                     Response.Write("false");  
  42.                     Response.End();  
  43.                 }  
  44.                  
  45.                  
  46.   
  47.   
  48.             }  


 

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

[html] view plaincopy
  1. /// <summary>   
  2.        /// Json转DataTable   
  3.        /// </summary>   
  4.        /// <param name="json"></param>   
  5.        /// <returns></returns>   
  6.        private DataTable Json2Dtb(string json)  
  7.        {  
  8.           
  9.                JavaScriptSerializer jss = new JavaScriptSerializer();  
  10.                ArrayList dic = jss.Deserialize<ArrayList>(json);  
  11.                DataTable dtb = new DataTable();  
  12.                if (dic.Count > 0)  
  13.                {  
  14.                    foreach (Dictionary<string, object> drow in dic)  
  15.                    {  
  16.                        if (dtb.Columns.Count == 0)  
  17.                        {  
  18.                            foreach (string key in drow.Keys)  
  19.                            {  
  20.                                dtb.Columns.Add(key, drow[key].GetType());  
  21.                            }  
  22.                        }  
  23.                        DataRow row = dtb.NewRow();  
  24.                        foreach (string key in drow.Keys)  
  25.                        {  
  26.                            row[key] = drow[key];  
  27.                        }  
  28.                        dtb.Rows.Add(row);  
  29.                    }  
  30.                }  
  31.              
  32.            return dtb;  
  33.        }  


 

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

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

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

 

[html] view plaincopy
  1. /// <summary>   
  2.         /// DataTable转Json   
  3.         /// </summary>   
  4.         /// <param name="dtb"></param>   
  5.         /// <returns></returns>   
  6.         private string Dtb2Json(DataTable dtb)  
  7.         {  
  8.             JavaScriptSerializer jss = new JavaScriptSerializer();  
  9.             ArrayList dic = new ArrayList();  
  10.             foreach (DataRow row in dtb.Rows)  
  11.             {  
  12.                 Dictionary<string, object> drow = new Dictionary<string, object>();  
  13.                 foreach (DataColumn col in dtb.Columns)  
  14.                 {  
  15.                     drow.Add(col.ColumnName, row[col.ColumnName]);  
  16.                 }  
  17.                 dic.Add(drow);  
  18.             }  
  19.             return jss.Serialize(dic);  
  20.         }  


 

然后写回到前台

 

[html] view plaincopy
  1. /// <summary>   
  2. /// 处理异步请求   
  3. /// </summary>   
  4. private void ProcessRequest()  
  5. {  
  6.     Response.ContentType = "text/html";  
  7.     string json = Request.Form["json"];  
  8.     //反序列化DataTable   
  9.     DataTable newdtb = Json2Dtb(json);  
  10.     //序列化DataTable为JSON   
  11.     string back = Dtb2Json(newdtb);  
  12.     Response.Write(back);  
  13.     Response.End();  
  14. }  

在前台接受显示：

 

[html] view plaincopy
  1. $(function() {   
  2.             //点击botton1   
  3.             $("#botton1").click(function() {   
  4.                     createTable(json);   
  5.               });   
  6.         });  
  7.   
  8.      //显示Json中的数据   
  9.         function createTable(json) {   
  10.             var table = $("<table border='1'></table>");   
  11.             for (var i = 0; i < json.length; i++) {   
  12.                 o1 = json[i];   
  13.                 var row = $("<tr></tr>");   
  14.                 for (key in o1) {   
  15.                     var td = $("<td></td>");   
  16.                     td.text(o1[key].toString());   
  17.                     td.appendTo(row);   
  18.                 }   
  19.                 row.appendTo(table);   
  20.             }   
  21.             table.appendTo($("#back"));   
  22.         }  


 

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

阅读排行

分类

归档