案例(用封装的ajax加载数据库的数据到页面)

提示：扫一扫查出行
【扫一扫了解最新限行尾号】
复制提示

本程序主要功能是以表格方式在网页上显示数据库的内容

LoadUsers.htm代码：

<head>
<title></title>
<script src="jquery-1.8.3.js" type="text/javascript"></script>
<script src="MyAjax.js" type="text/javascript"></script>
<script type="text/javascript">
$(function () {
MyAjax("LoadUsers.ashx",
function (resTxt) {
var users = resTxt.split("|");
for (var i = 0; i < users.length; i++) {
var user = users[i];
var fileds = user.split(",");
var id = fileds[0];
var name = fileds[1];
var password = fileds[2];
$("#tbody1").append("<tr><td>" + id + "</td><td>" +
name + "</td><td>" + password + "</td></tr>");
}
},
function (status) {
alert("加载数据错误");
});
});
</script>
</head>
<body>
<table border="1" cellpadding="0" cellspacing="0">
<thead>
<tr>
<th>id</th>
<th>name</th>
<th>password</th>
</tr>
</thead>
<tbody id="tbody1" align="center">
</tbody>
</table>
</body>

LoadUsers.adhx代码：

public void ProcessRequest(HttpContext context)
{
context.Response.ContentType = "text/plain";
List<string> list = new List<string>();
DataTable table = SQLHelper.ExecuteReader("select * from Users");
foreach (DataRow row in table.Rows)
{
list.Add(row["id"] + "," + row["name"] + "," + row["password"]);
}
string str = string.Join("|",list);//1,admin,123|2,bbb,123|3,aaa,123
context.Response.Write(str);
}