Asp.net下使用Jquery Ajax传送和接收DataTable的代码
Asp.net下使用Jquery Ajax传送和接收DataTable的代码
发布时间:2016-12-30 来源:查字典编辑
摘要:服务器再把GridView反构造成DataTable,再给DataTable增加一行之后,绑定到GridView,然后发回客户端...能不能...

服务器再把GridView反构造成DataTable, 再给DataTable增加一行之后,绑定到GridView,然后发回客户端...

能不能简单一点呢?

在使用Ajax数据请求数据,通常都是简单格式,比如String,信息量较少。当然也可以请求回XML,但是XML数据冗余多,取到客户端处理比json麻烦的多。

能不能简单一点呢?

上面这些问题,如果DataTable与JSON类型可以方便的相互转换,都可以迎刃而解了。

优点:1)避免不必要的回传;

2)精简异步请求数据的大小 ;

3)解决数据量较大时,数据发送与接收繁琐的问题。

既然好处这么多,我们上代码吧。

前台代码:

复制代码 代码如下:

<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">

<title></title>

<script type="text/javascript" src="js/jquery-1.4.2.min.js"></script>

<script type="text/javascript" src="js/json2.js"></script>

<script type="text/javascript">

//onload

$(function() {

//点击botton1

$("#botton1").click(function() {

var url = "default.aspx?ajax=1";

var dtb = generateDtb();

//序列化对象

var postdata = JSON.stringify(dtb);

//异步请求

$.post(url, { json: postdata }, function(json) {

createTable(json);

}, "json")

});

});

//生成DataTable对象

function generateDtb() {

var dtb = new Array();

for (var i = 0; i < 10; i++) {

var row = new Object();

row.col1 = i;

row.col2 = i % 2 == 0 ? true : false;

row.col3 = i + "henll"ow";

dtb.push(row);

}

return dtb;

}

//显示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"));

}

</script>

</head>

<body>

<form id="form1" runat="server">

<div>

<input id="botton1" type="button" value="button" />

<div id="back">

</div>

</div>

</form>

</body>

</html>

后台代码:

/// <summary>

复制代码 代码如下:

/// 页面加载时

/// </summary>

/// <param name="sender"></param>

/// <param name="e"></param>

protected void Page_Load(object sender, EventArgs e)

{

//判断是否异步请求

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

{

ProcessRequest();

}

}

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

}

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

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

}

再附一个下载文件,觉得有用的可以下载看看

json.zip

推荐文章
猜你喜欢
附近的人在看
推荐阅读
拓展阅读
相关阅读
网友关注
最新Javascript教程学习
热门Javascript教程学习
编程开发子分类