jquery使用ajax读取后台数据在表格中显示
分类：实例代码
本章节介绍一下如何从数据库读取数据，然后通过ajax显示于前台表格中。
使用原生的方式可以参阅前台怎样获取后台ajax数据简单介绍一章节。
下面介绍一下如何使用jquery的ajax实现此功能。
代码实例如下:
<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="http://www.pipipi.net/" />
<title>犀牛前端部落</title>
<script src="http://libs.baidu.com/jquery/1.9.0/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$("#bt").click(function () {
var str = "<table>";
$.ajax({
url: "demo/ajax/net/jqueryAjax.ashx",
data: {},
type: "get",
async: true,
dataType:"json",
success: function (json) {
$.each(json, function (index, obj) {
$.each(obj, function (y, data) {
str = str + "<tr>";
str = str + "<td>" + data["username"]
+ "</td><td>" + data["address"]
+ "</td><td>" + data["score"] + "</td>";
str = str + "</tr>";
})
})
str = str + "</tr></table>";
$("#antzone").html(str);
}
});
})
})
</script>
</head>
<body>
<div id="antzone"></div>
<input type="button" id="bt" value="查看效果"/>
</body>
</html>
上面的代码实现了我们的要求，通过jquery的ajax方式实现了获取后台数据的功能。
c#代码如下:
namespace ajax
{
/// <summary>
/// jqueryAjax 的摘要说明
/// </summary>
public class jqueryAjax : IHttpHandler
{
public void ProcessRequest(HttpContext context)
{
context.Response.ContentType = "text/plain";
DataSet ds = done();
string jsonStr = GetJsonByDataset(ds);
context.Response.Write(jsonStr);
}
private DataSet done()
{
string connString = ConfigurationManager.ConnectionStrings["access_con"].ConnectionString;
string configPath = ConfigurationManager.ConnectionStrings["access_path"].ConnectionString;
string conPath = HttpContext.Current.Server.MapPath(configPath);
OleDbConnection conn = new OleDbConnection(connString + conPath);
string sql = "select * from code";
OleDbCommand cmd = new OleDbCommand(sql, conn);
OleDbDataAdapter da = new OleDbDataAdapter(cmd);
DataSet ds = new DataSet();
da.Fill(ds, "ds");
return ds;
}
private string GetJsonByDataset(DataSet ds)
{
if (ds == null || ds.Tables.Count <= 0 || ds.Tables[0].Rows.Count <= 0)
{
//如果查询到的数据为空则返回标记ok:false
return "{\"ok\":false}";
}
StringBuilder sb = new StringBuilder();
sb.Append("{");
foreach (DataTable dt in ds.Tables)
{
sb.Append(string.Format("\"{0}\":[", dt.TableName));
foreach (DataRow dr in dt.Rows)
{
sb.Append("{");
for (int i = 0; i < dr.Table.Columns.Count; i++)
{
sb.AppendFormat("\"{0}\":\"{1}\",", dr.Table.Columns[i].ColumnName.Replace("\"", "\\"").Replace("\'", "\\'"), ObjToStr(dr[i]).Replace("\"", "\\"").Replace("\'", "\\'")).Replace(Convert.ToString((char)13), "\r\n").Replace(Convert.ToString((char)10), "\r\n");
}
sb.Remove(sb.ToString().LastIndexOf(','), 1);
sb.Append("},");
}
sb.Remove(sb.ToString().LastIndexOf(','), 1);
sb.Append("],");
}
sb.Remove(sb.ToString().LastIndexOf(','), 1);
sb.Append("}");
return sb.ToString();
}
private string ObjToStr(object ob)
{
if (ob == null)
{
return string.Empty;
}
else
return ob.ToString();
}
public bool IsReusable
{
get
{
return false;
}
}
}
}
