通过Jquery的Ajax方法读取将table转换为Json_Javascript教程-查字典教程网
通过Jquery的Ajax方法读取将table转换为Json
通过Jquery的Ajax方法读取将table转换为Json
发布时间:2017-01-14 来源:查字典编辑
摘要:1.创建Users表复制代码代码如下:createtableUsers(UserIdintidentity(1,1)primarykey,U...

1. 创建Users表

复制代码 代码如下:

create table Users

(

UserId int identity(1,1) primary key,

UserName varchar(20)

)

insert into Users values('Bradley')

insert into Users values('Dan')

复制代码 代码如下:

create table Users

(

UserId int identity(1,1) primary key,

UserName varchar(20)

)

insert into Users values('Bradley')

insert into Users values('Dan')

2. 创建JsonHelper类

复制代码 代码如下:

public class JsonHelper

{

#region 序列化和反序列化

// 序列化

public static string JsonSerializer<T>(T t)

{

// 使用 DataContractJsonSerializer 将 T 对象序列化为内存流。

DataContractJsonSerializer jsonSerializer = new DataContractJsonSerializer(typeof (T));

MemoryStream ms = new MemoryStream();

// 使用 WriteObject 方法将 JSON 数据写入到流中。

jsonSerializer.WriteObject(ms, t);

// 流转字符串

string jsonString = Encoding.UTF8.GetString(ms.ToArray());

ms.Close();

//替换Json的Date字符串

string p = @"/Date((d+)+d+)/";

MatchEvaluator matchEvaluator = new MatchEvaluator(ConvertJsonDateToDateString);

Regex reg = new Regex(p);

jsonString = reg.Replace(jsonString, matchEvaluator);

return jsonString;

}

public static T JsonDeserialize<T>(string jsonString)

{

//将"yyyy-MM-dd HH:mm:ss"格式的字符串转为"/Date(1294499956278+0800)/"格式

string p = @"d{4}-d{2}-d{2}sd{2}:d{2}:d{2}";

MatchEvaluator matchEvaluator = new MatchEvaluator(ConvertDateStringToJsonDate);

Regex reg = new Regex(p);

jsonString = reg.Replace(jsonString, matchEvaluator);

DataContractJsonSerializer jsonSerializer=new DataContractJsonSerializer(typeof(T));

// 字符串转流

MemoryStream ms=new MemoryStream(Encoding.UTF8.GetBytes(jsonString));

// 通过使用 DataContractJsonSerializer 的 ReadObject 方法,将 JSON 编码数据反序列化为T

T obj = (T) jsonSerializer.ReadObject(ms);

return obj;

}

public static string ConvertJsonDateToDateString(Match match)

{

string result = string.Empty;

DateTime dateTime=new DateTime(1970,1,1);

dateTime = dateTime.AddMilliseconds(long.Parse(match.Groups[1].Value));

dateTime = dateTime.ToLocalTime();

result = dateTime.ToString("yyyy-MM-dd HH:mm:ss");

return result;

}

private static string ConvertDateStringToJsonDate(Match m)

{

string result = string.Empty;

DateTime dt = DateTime.Parse(m.Groups[0].Value);

dt = dt.ToUniversalTime();

TimeSpan ts = dt - DateTime.Parse("1970-01-01");

result = string.Format("/Date({0}+0800)/",ts.TotalMilliseconds);

return result;

}

#endregion

// 对象转换为Json

public static string ObjectToJson(object obj)

{

JavaScriptSerializer js=new JavaScriptSerializer();

try

{

return js.Serialize(obj);

}

catch (Exception exception)

{

throw new Exception(exception.Message);

}

}

// 数据表转化为集合

public static List<Dictionary<string,object>> DataTableToList(DataTable dt)

{

List<Dictionary<string ,object>> list=new List<Dictionary<string, object>>();

foreach (DataRow dataRow in dt.Rows)

{

Dictionary<string,object> dic=new Dictionary<string, object>();

foreach (DataColumn dc in dt.Columns)

{

dic.Add(dc.ColumnName,dataRow[dc.ColumnName]);

}

list.Add(dic);

}

return list;

}

// 表转换为Json

public static string DataTableToJson(DataTable dt)

{

return ObjectToJson(DataTableToList(dt));

}

}

复制代码 代码如下:

public class JsonHelper

{

#region 序列化和反序列化

// 序列化

public static string JsonSerializer<T>(T t)

{

// 使用 DataContractJsonSerializer 将 T 对象序列化为内存流。

DataContractJsonSerializer jsonSerializer = new DataContractJsonSerializer(typeof (T));

MemoryStream ms = new MemoryStream();

// 使用 WriteObject 方法将 JSON 数据写入到流中。

jsonSerializer.WriteObject(ms, t);

// 流转字符串

string jsonString = Encoding.UTF8.GetString(ms.ToArray());

ms.Close();

//替换Json的Date字符串

string p = @"/Date((d+)+d+)/";

MatchEvaluator matchEvaluator = new MatchEvaluator(ConvertJsonDateToDateString);

Regex reg = new Regex(p);

jsonString = reg.Replace(jsonString, matchEvaluator);

return jsonString;

}

public static T JsonDeserialize<T>(string jsonString)

{

//将"yyyy-MM-dd HH:mm:ss"格式的字符串转为"/Date(1294499956278+0800)/"格式

string p = @"d{4}-d{2}-d{2}sd{2}:d{2}:d{2}";

MatchEvaluator matchEvaluator = new MatchEvaluator(ConvertDateStringToJsonDate);

Regex reg = new Regex(p);

jsonString = reg.Replace(jsonString, matchEvaluator);

DataContractJsonSerializer jsonSerializer=new DataContractJsonSerializer(typeof(T));

// 字符串转流

MemoryStream ms=new MemoryStream(Encoding.UTF8.GetBytes(jsonString));

// 通过使用 DataContractJsonSerializer 的 ReadObject 方法,将 JSON 编码数据反序列化为T

T obj = (T) jsonSerializer.ReadObject(ms);

return obj;

}

public static string ConvertJsonDateToDateString(Match match)

{

string result = string.Empty;

DateTime dateTime=new DateTime(1970,1,1);

dateTime = dateTime.AddMilliseconds(long.Parse(match.Groups[1].Value));

dateTime = dateTime.ToLocalTime();

result = dateTime.ToString("yyyy-MM-dd HH:mm:ss");

return result;

}

private static string ConvertDateStringToJsonDate(Match m)

{

string result = string.Empty;

DateTime dt = DateTime.Parse(m.Groups[0].Value);

dt = dt.ToUniversalTime();

TimeSpan ts = dt - DateTime.Parse("1970-01-01");

result = string.Format("/Date({0}+0800)/",ts.TotalMilliseconds);

return result;

}

#endregion

// 对象转换为Json

public static string ObjectToJson(object obj)

{

JavaScriptSerializer js=new JavaScriptSerializer();

try

{

return js.Serialize(obj);

}

catch (Exception exception)

{

throw new Exception(exception.Message);

}

}

// 数据表转化为集合

public static List<Dictionary<string,object>> DataTableToList(DataTable dt)

{

List<Dictionary<string ,object>> list=new List<Dictionary<string, object>>();

foreach (DataRow dataRow in dt.Rows)

{

Dictionary<string,object> dic=new Dictionary<string, object>();

foreach (DataColumn dc in dt.Columns)

{

dic.Add(dc.ColumnName,dataRow[dc.ColumnName]);

}

list.Add(dic);

}

return list;

}

// 表转换为Json

public static string DataTableToJson(DataTable dt)

{

return ObjectToJson(DataTableToList(dt));

}

}

3. 添加ashx代码文件

复制代码 代码如下:

public class GetData : IHttpHandler

{

public void ProcessRequest(HttpContext context)

{

context.Response.ContentType = "text/plain";

if (context.Request["action"]=="display")

{

context.Response.Write(JsonHelper.DataTableToJson(GetAllUsers()));

}

}

static SqlConnection conn = new SqlConnection("server=.;database=Test;uid=sa;pwd=123456");

public static DataTable GetAllUsers()

{

string sql = "select * from users";

SqlDataAdapter adapter = new SqlDataAdapter(sql, conn);

DataTable dt = new DataTable();

adapter.Fill(dt);

return dt;

}

public bool IsReusable

{

get

{

return false;

}

}

}

复制代码 代码如下:

public class GetData : IHttpHandler

{

public void ProcessRequest(HttpContext context)

{

context.Response.ContentType = "text/plain";

if (context.Request["action"]=="display")

{

context.Response.Write(JsonHelper.DataTableToJson(GetAllUsers()));

}

}

static SqlConnection conn = new SqlConnection("server=.;database=Test;uid=sa;pwd=123456");

public static DataTable GetAllUsers()

{

string sql = "select * from users";

SqlDataAdapter adapter = new SqlDataAdapter(sql, conn);

DataTable dt = new DataTable();

adapter.Fill(dt);

return dt;

}

public bool IsReusable

{

get

{

return false;

}

}

}

4. 前端调用

复制代码 代码如下:

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

<head runat="server">

<title></title>

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

<script type="text/javascript">

$(function() {

var options = {

type: 'post',

url: "/GetData.ashx",

dataType: "json",

data: { action: "display" },

success: function(data) {

var html = "<table border='2px'><tr><td>UserId</td><td>UserName</td></tr>";

$.each(data, function(i, result) {

html += "<tr><td>" + result["UserId"] + "</td><td>" + result["UserName"] + "</td></tr>";

})

html += "</table>";

$("#divData").html(html);

}

};

$.ajax(options);

});

</script>

</head>

<body>

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

<div id="divData">

</div>

</form>

</body>

</html>

复制代码 代码如下:

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

<head runat="server">

<title></title>

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

<script type="text/javascript">

$(function() {

var options = {

type: 'post',

url: "/GetData.ashx",

dataType: "json",

data: { action: "display" },

success: function(data) {

var html = "<table border='2px'><tr><td>UserId</td><td>UserName</td></tr>";

$.each(data, function(i, result) {

html += "<tr><td>" + result["UserId"] + "</td><td>" + result["UserName"] + "</td></tr>";

})

html += "</table>";

$("#divData").html(html);

}

};

$.ajax(options);

});

</script>

</head>

<body>

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

<div id="divData">

</div>

</form>

</body>

</html>

5. 效果图

6. 同样可以通过getJSON方法读取数据

复制代码 代码如下:

$.getJSON("/GetData.ashx",{ action: "display" },function(data) {

var html = "<table border='2px'><tr><td>UserId</td><td>UserName</td></tr>";

$.each(data, function(i, result) {

html += "<tr><td>" + result["UserId"] + "</td><td>" + result["UserName"] + "</td></tr>";

})

html += "</table>";

$("#divData").html(html);

})

复制代码 代码如下:

$.getJSON("/GetData.ashx",{ action: "display" },function(data) {

var html = "<table border='2px'><tr><td>UserId</td><td>UserName</td></tr>";

$.each(data, function(i, result) {

html += "<tr><td>" + result["UserId"] + "</td><td>" + result["UserName"] + "</td></tr>";

})

html += "</table>";

$("#divData").html(html);

})

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