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

转自：/article/2777258.html

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

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

[html] view
plaincopy

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串传入到后台：

[html] view
plaincopy

$(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")

}

});

});

在后台的操作：

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

[html] view
plaincopy

if (!IsPostBack)

{

//判断是否异步请求

if (Request.QueryString["ajax"] == "1")

{

ProcessRequest();

}

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

[html] view
plaincopy

/// <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

[html] view
plaincopy

/// <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数据

[html] view
plaincopy

/// <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);

}

然后写回到前台

[html] view
plaincopy

/// <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();

}

在前台接受显示：

[html] view
plaincopy

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