通过Jquery的Ajax方法读取将table转换为Json

  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}\s\d{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}\s\d{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' style='text-align:center;border-style:solid;border-width:2px;border-color:#00ff00;'><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' style='text-align:center;border-style:solid;border-width:2px;border-color:#00ff00;'><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. 效果图

通过Jquery的Ajax方法读取将table转换为Json

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

  

复制代码 代码如下:

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

  var html = "<table border='2px' style='text-align:center;border-style:solid;border-width:2px;border-color:#00ff00;'><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' style='text-align:center;border-style:solid;border-width:2px;border-color:#00ff00;'><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);

  })