您的位置：首页 > Web前端 > JavaScript

读取Json数据

2012-03-06 15:19 78 查看

前台页面：

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>

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

<script type="text/javascript">
$(document).ready(function() {
//最底层方法读取json数据
$("#btn_showJson").click(function() {
var options = {
type: "POST",
url: "TestPage1.aspx",
dataType: "json",
success: function(data) {
var html = "<table border='2px' style='text-align:center;border-style:solid;border-width:2px;border-color:#00ff00;'><tr><td>编号</td><td>姓名</td><td>性别</td><td>地址</td></tr>";
$.each(data, function(i, result) {
html += "<tr><td>" + result["uid"] + "</td><td>" + result["uname"] + "</td>";
html += "<td>" + result["sex"] + "</td><td>" + result["address"] + "</td></tr>";
})

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

}
};
$.ajax(options);
});
//通过第三层的getJson方法读取json类型的数据
$("#btn_showJson2").click(function() {
$.getJSON("TestPage1.aspx", function(data) {
var html = "<table border='2px' style='text-align:center;border-style:solid;border-width:2px;border-color:#00ff00;'><tr><td>编号</td><td>姓名</td><td>性别</td><td>地址</td></tr>";
$.each(data, function(i, result) {
html += "<tr><td>" + result["uid"] + "</td><td>" + result["uname"] + "</td>";
html += "<td>" + result["sex"] + "</td><td>" + result["address"] + "</td></tr>";
});
$("#div1").html(html);
});
})

})
</script>

</head>
<body>
<form id="form1" runat="server">
<input type="button" id="btn_showJson" value="ajax读取json数据" />
<input type="button" id="btn_showJson2" value="getJson读取json数据" />
<div id="div1">
</div>
</form>
</body>
</html>

JsonHelper：

public class JsonHelper
{
/// <summary>
/// 对象转JSON
/// </summary>
/// <param name="obj"></param>
/// <returns></returns>
public static string ObjectToJson(object obj)
{
JavaScriptSerializer jss = new JavaScriptSerializer();
try
{
return jss.Serialize(obj);
}
catch (Exception ex)
{
throw new Exception(ex.Message);
}
}
//public static string JsonToObject()
//{
//}
/// <summary>
/// 数据表转换List集合
/// </summary>
/// <param name="dt">数据表</param>
/// <returns>List集合</returns>
public static List<Dictionary<string, object>> DataTableToList(DataTable dt)
{
List<Dictionary<string, object>> list = new List<Dictionary<string, object>>();
foreach (DataRow dr in dt.Rows)
{
Dictionary<string, object> dic = new Dictionary<string, object>();
foreach (DataColumn dc in dt.Columns)
{
dic.Add(dc.ColumnName, dr[dc.ColumnName]);
}
list.Add(dic);
}
return list;
}
/// <summary>
/// 把表转为json
/// </summary>
/// <param name="dt">数据表</param>
/// <returns>json类型字符串</returns>
public static string DataTableToJson(DataTable dt)
{
return ObjectToJson(DataTableToList(dt));
}
}

DBHelper：

public class DBHelper
{
static SqlConnection conn = new SqlConnection("server=.;database=Example;uid=sa;pwd=***");
public static DataTable GetAllUsers()
{
string sql = "select * from userinfo";
SqlDataAdapter adapter = new SqlDataAdapter(sql, conn);
DataTable dt = new DataTable();
adapter.Fill(dt);
return dt;
}
}

TestPage.aspx:

if (!IsPostBack)
{
Response.Write(JsonHelper.DataTableToJson(DBHelper.GetAllUsers()));
Response.End();
}

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签： json function html object getjson exception

相关文章推荐

新的分享

章节导航