本人正在通过制作留言程序来学习ASP.net,其中一个功能是每条留言允许多人回复,我想实现的效果是:打开留言页面后只加载留言不加载回复,单击某条留言后面的“查看回复”按钮后,通过AJAX显示该条留言的所有回复。
在论坛中找了半天,看见“
层的显示问题”中“孟宪会版主”的回复,看了之后受益良多。现在我要的效果基本已经实现。
我想问如何在document.getElementById("content" + dataID).innerHTML = x.responseText;中读出一个数据集合呢?比如回复人的昵称、回复内容、回复时间等等?
<%@ Page Language="C#" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script runat="server">
System.Data.DataView CreateDataSourceByXianhuiMeng()
{
System.Data.DataTable dt = new System.Data.DataTable();
System.Data.DataRow dr;
dt.Columns.Add(new System.Data.DataColumn("id", typeof(System.Int32)));
dt.Columns.Add(new System.Data.DataColumn("学生姓名", typeof(System.String)));
dt.Columns.Add(new System.Data.DataColumn("语文", typeof(System.Decimal)));
dt.Columns.Add(new System.Data.DataColumn("数学", typeof(System.Decimal)));
dt.Columns.Add(new System.Data.DataColumn("英语", typeof(System.Decimal)));
dt.Columns.Add(new System.Data.DataColumn("计算机", typeof(System.Decimal)));
for (int i = 0; i < 30; i++)
{
System.Random rd = new System.Random(Environment.TickCount * i); ;
dr = dt.NewRow();
dr[0] =i;
dr[1] = "【孟子E章】" + i.ToString();
dr[2] = System.Math.Round(rd.NextDouble() * 100, 2);
dr[3] = System.Math.Round(rd.NextDouble() * 100, 2);
dr[4] = System.Math.Round(rd.NextDouble() * 100, 2);
dr[5] = System.Math.Round(rd.NextDouble() * 100, 2);
dt.Rows.Add(dr);
}
System.Data.DataView dv = new System.Data.DataView(dt);
return dv;
}
private void showData(string cid)
{
Response.ClearContent();
Response.Write("去查数据库,找到数据库中 " + cid + " 记录的值。");
Response.End();
}
protected void Page_Load(object sender, EventArgs e)
{
if (!String.IsNullOrEmpty(Request.QueryString["id"]))
{
this.showData(Request.QueryString["id"].ToString());
return;
}
this.GridView1.DataSource = this.CreateDataSourceByXianhuiMeng();
this.GridView1.DataBind();
}
</script>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script type="text/javascript">
function getData(dataID) {
if (document.getElementById("content" + dataID).style.display != "none") {
document.getElementById("content" + dataID).style.display = "none"
return;
}
else {
document.getElementById("content" + dataID).style.display = ""
if (document.getElementById("content" + dataID).innerHTML == "") //或者其他的内容
{
var x = new createXmlHttp();
x.open("GET", "Default10.aspx?id=" + dataID, false)
x.send(null);
if (x.status == 200) {
if (x.readyState == 4) {
document.getElementById("content" + dataID).innerHTML = x.responseText;
}
}
}
}
}
function createXmlHttp() {
var xmlhttp_request = false;
try {
xmlhttp_request = new ActiveXObject('Msxml2.XMLHTTP');
} catch (e) {
try {
xmlhttp_request = new ActiveXObject('Microsoft.XMLHTTP');
} catch (E) {
xmlhttp_request = null;
}
}
if (!xmlhttp_request && typeof XMLHttpRequest != 'undefined') {
xmlhttp_request = new XMLHttpRequest();
}
return xmlhttp_request;
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="false">
<Columns>
<asp:TemplateField>
<ItemTemplate>
<div>
<a href="" onclick='getData(<%#Eval("id")%>);return false;'>
<%#Eval("学生姓名")%>
</a>
</div>
<div id="content<%#Eval("id")%>" style="display:none;"></div>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
</div>
</form>
</body>
</html>