AJAX刷新Gridview-优快云博客

本文介绍了一个使用ASP.NET进行数据展示的例子，并通过AJAX实现数据的动态加载。该示例创建了一个包含学生信息的数据表，并在网页上通过GridView组件显示数据，同时利用AJAX实现了根据选项变化动态更新数据。

using System;
using System.Configuration;
using System.Data;
using System.Linq;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.HtmlControls;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;

using System.Xml.Linq;

public partial class _Default : System.Web.UI.Page
{


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();
}
}

public override void VerifyRenderingInServerForm(Control control)

{ }

}

<%@ Page Language="C#" AutoEventWireup="true"    CodeFile="Default.aspx.cs" Inherits="_Default" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
        <title>AJAX练习</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" GridLines="Horizontal" Width="100%">
            <HeaderStyle BackColor="#00CCFF" />
            <AlternatingRowStyle BackColor="#CCCCCC" />
        </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>

本文转自 BruceAndLee 51CTO博客，原文链接：http://blog.51cto.com/leelei/315839，如需转载请自行联系原作者