很多用戶都有這樣需求，比如：點擊按鈕，刷新 GridVIEw 中的數據，而不是這個頁面刷新。使用簡單的 XMLHttpRequest 就可以直接實現。具體代碼如下：
<%@ 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 = 1; 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;
}
protected void Page_Load(object sender, EventArgs e)
{
if (Request.QueryString["id"] != null)
{
Response.ClearContent();
GridVIEw1.DataSource = CreateDataSourceByXianhuiMeng();
GridVIEw1.DataBind();
System.Text.StringBuilder sb = new System.Text.StringBuilder();
System.IO.StringWriter sw = new System.IO.StringWriter(sb);
HtmlTextWriter htw = new HtmlTextWriter(sw);
Literal header = new Literal();
header.Text = "<h2>項目 " + Request.QueryString["id"] + "</h2>";
Header.Controls.Add(header);
Header.RenderControl(htw);
GridVIEw1.RenderControl(htw);
Response.Write("這裡查詢數據，輸出結果就可以了。結果：" + sb.ToString());
Response.End();
}
}
/// 添加這個override void VerifyRenderingInServerForm(Control control)，是為了避免出現
/// 類型“GridView”的控件“GridVIEw1”必須放在具有 runat=server 的窗體標記內。
/// 的異常
public override void VerifyRenderingInServerForm(Control control)
{ }
</script>
<Html XMLns="http://www.w3.org/1999/xHtml">
<head id="Head1" runat="server">
<title>使用 AJax，局部刷新 GridVIEw 進行數據綁定的簡單實現</title>
<script type="text/Javascript">
function GetData(p) {
document.getElementById("d").innerHtml = "正在讀取數據……";
h = window.XMLHttpRequest ? new window.XMLHttpRequest() : new ActiveXObject("MSXML2.XMLHTTP");
h.open("GET", '<%=Request.FilePath %>?id=' + p.value, true);
h.onreadystatechange = function() {
if (h.readyState == 4) {
if (h.status >= 200 && h.status < 300) {
document.getElementById("d").innerHtml = h.responseText;
}
else {
document.getElementById("d").innerHtml = "<h2>數據操作錯誤：</h2>" + h.responseText;
}
}
}
h.send(null);
}
alert("這個提示，只出現在第一次打開頁面。");
</script>
</head>
<body>
<form id="form1" runat="server">
<ASP:GridVIEw ID="GridVIEw1" runat="server"></ASP:GridVIEw>
<ASP:Panel ID="Header" runat="server"></ASP:Panel>
<select onchange="GetData(this)">
<option value="1">項目一</option>
<option value="2">項目二</option>
</select>
</form>
<div id="d"></div>
</body>
</Html>