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

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

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

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

 

[html]  view plain copy

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 plain copy

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 plain copy

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

 

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

[html]  view plain copy

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 plain copy

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 plain copy

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 plain copy

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 plain copy

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本身具有不安全性和不稳定行，对于一些比较重要的数据，建议还是寻找一些更可靠的方法。