登 录
本人最近在學習Ajax之中看見【孟子E章】有這樣的一篇文章，所以借鑒學習一下，好了，先看看他的代碼吧。
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="GridView.aspx.cs" Inherits="GridView" %></p> <p><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><br /> <mce:script runat="server"><!--<br /> System.Data.DataView CreateDataSourceByXianhuiMeng()<br /> {<br /> System.Data.DataTable dt = new System.Data.DataTable();<br /> System.Data.DataRow dr;<br /> dt.Columns.Add(new System.Data.DataColumn(" id ", typeof(System.Int32)));<br /> dt.Columns.Add(new System.Data.DataColumn(" 学生姓名 ", typeof(System.String)));<br /> dt.Columns.Add(new System.Data.DataColumn(" 语文 ", typeof(System.Decimal)));<br /> dt.Columns.Add(new System.Data.DataColumn(" 数学 ", typeof(System.Decimal)));<br /> dt.Columns.Add(new System.Data.DataColumn(" 英语 ", typeof(System.Decimal)));<br /> dt.Columns.Add(new System.Data.DataColumn(" 计算机 ", typeof(System.Decimal)));</p> <p> for (int i = 1; i < 10; i++)<br /> {<br /> System.Random rd = new System.Random(Environment.TickCount * i); ;<br /> dr = dt.NewRow();<br /> dr[0] = i;<br /> dr[1] = " 【孟子E章】 " + i.ToString();<br /> dr[2] = System.Math.Round(rd.NextDouble() * 100, 2);<br /> dr[3] = System.Math.Round(rd.NextDouble() * 100, 2);<br /> dr[4] = System.Math.Round(rd.NextDouble() * 100, 2);<br /> dr[5] = System.Math.Round(rd.NextDouble() * 100, 2);<br /> dt.Rows.Add(dr);<br /> }<br /> System.Data.DataView dv = new System.Data.DataView(dt);<br /> return dv;<br /> }</p> <p> protected void Page_Load(object sender, EventArgs e)<br /> {<br /> if (Request.QueryString["id"] != null)<br /> {<br /> Response.ClearContent();<br /> GridView1.DataSource = CreateDataSourceByXianhuiMeng();<br /> GridView1.DataBind();<br /> System.Text.StringBuilder sb = new System.Text.StringBuilder();<br /> System.IO.StringWriter sw = new System.IO.StringWriter(sb);<br /> HtmlTextWriter htw = new HtmlTextWriter(sw);<br /> Literal header = new Literal();<br /> header.Text = " <h2>项目 " + Request.QueryString["id"] + "</h2> ";<br /> Header.Controls.Add(header);<br /> Header.RenderControl(htw);<br /> GridView1.RenderControl(htw);<br /> Response.Write(" 这里查询数据，输出结果就可以了。结果： " + sb.ToString());<br /> Response.End();<br /> }<br /> }</p> <p> public override void VerifyRenderingInServerForm(Control control)<br /> { }<br /> // --></mce:script></p> <p><html xmlns="http://www.w3.org/1999/xhtml"><br /> <head runat="server"><br /> <title > 使用 AJAX，局部刷新 GridView 进行数据绑定的简单实现 </title > </p> <p> <script type ="text/javascript" ><br /> function GetData(p) {<br /> document.getElementById( "d" ).innerHTML = " 正在读取数据…… " ;<br /> h = window.XMLHttpRequest?new window.XMLHttpRequest():new ActiveXObject("MSXML2.XMLHTTP");<br /> h.open( "GET" , '<%=Request.FilePath%>?id='+p.value, true );<br /> h.onreadystatechange = function () {<br /> if (h.readyState == 4 ) {<br /> if (h.status >= 200 && h.status < 300 ) {<br /> document.getElementById( "d" ).innerHTML = h.responseText;<br /> }<br /> else {<br /> document.getElementById( "d" ).innerHTML = " <h2>数据操作错误：</h2> " + h.responseText;<br /> }<br /> }<br /> }<br /> h.send( null );<br /> }<br /> alert( " 这个提示，只出现在第一次打开页面。 " );<br /> </script > </p> <p></head><br /> <body><br /> <form id ="form1" runat ="server" ><br /> <asp:GridView ID ="GridView1" runat ="server" ></asp:GridView ><br /> <asp:Panel ID ="Header" runat ="server" ></asp:Panel ><br /> <select onchange ="GetData(this)" ><br /> <option value ="1" > 项目一 </option ><br /> <option value ="2" > 项目二 </option ><br /> </select ><br /> </form ><br /> <div id ="d" ></div > </p> <p></body><br /> </html><br />
根據學習自己也做了個測試學習。舉一反三嘛。以後還是這樣跟大家好好的學習！
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="test.aspx.cs" Inherits="test" %></p> <p><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><br /> <mce:script runat="server"><!--<br /> System.Data.DataView CreateDataSourceByXianhuiMeng(string table)<br /> {<br /> System.Data.SqlClient.SqlConnection conn = new System.Data.SqlClient.SqlConnection();<br /> conn.ConnectionString = "Data Source=3D00A111//SQLEXPRESS;Initial Catalog=Test;Integrated Security=True";<br /> conn.Open();<br /> System.Data.SqlClient.SqlDataAdapter cmd = new System.Data.SqlClient.SqlDataAdapter("select * from "+table, conn);<br /> //DataSet ds = new DataSet();<br /> System.Data.DataTable dt = new System.Data.DataTable();<br /> cmd.Fill(dt);<br /> conn.Close();<br /> System.Data.DataView dv = new System.Data.DataView(dt);<br /> return dv;<br /> }</p> <p> protected void Page_Load(object sender, EventArgs e)<br /> {<br /> if (Request.QueryString["id"] != null)<br /> {<br /> Response.ClearContent();<br /> if (Request.QueryString["id"] == "1")<br /> {<br /> GridView1.DataSource = CreateDataSourceByXianhuiMeng("test");<br /> }<br /> else<br /> {<br /> GridView1.DataSource = CreateDataSourceByXianhuiMeng("grades");<br /> }<br /> GridView1.DataBind();<br /> System.Text.StringBuilder sb = new System.Text.StringBuilder();<br /> System.IO.StringWriter sw = new System.IO.StringWriter(sb);<br /> HtmlTextWriter htw = new HtmlTextWriter(sw);<br /> Literal header = new Literal();<br /> header.Text = " <h2>项目 " + Request.QueryString["id"] + "</h2> ";<br /> Header.Controls.Add(header);<br /> Header.RenderControl(htw);<br /> GridView1.RenderControl(htw);<br /> Response.Write(" 这里查询数据，输出结果就可以了。结果： " + sb.ToString());<br /> Response.End();<br /> }<br /> }</p> <p> public override void VerifyRenderingInServerForm(Control control)<br /> { }<br /> // --></mce:script><br /> <html xmlns="http://www.w3.org/1999/xhtml"><br /> <head runat="server"><br /> <title > 使用 AJAX，局部刷新 GridView 进行数据绑定的简单实现 </title > </p> <p> <script type ="text/javascript" ><br /> function GetData(p) {<br /> document.getElementById( "d" ).innerHTML = " 正在读取数据…… " ;<br /> h = window.XMLHttpRequest?new window.XMLHttpRequest():new ActiveXObject("MSXML2.XMLHTTP");<br /> h.open( "GET" , '<%=Request.FilePath%>?id='+p.value, true );<br /> h.onreadystatechange = function () {<br /> if (h.readyState == 4 ) {<br /> if (h.status >= 200 && h.status < 300 ) {<br /> document.getElementById( "d" ).innerHTML = h.responseText;<br /> }<br /> else {<br /> document.getElementById( "d" ).innerHTML = " <h2>数据操作错误：</h2> " + h.responseText;<br /> }<br /> }<br /> }<br /> h.send( null );<br /> }<br /> </script ><br /> </head></p> <p><body><br /> <form id ="form1" runat ="server" ><br /> <asp:GridView ID ="GridView1" runat ="server" ></asp:GridView ><br /> <asp:Panel ID ="Header" runat ="server" ></asp:Panel ><br /> <select onchange ="GetData(this)" ><br /> <option value ="1" > 项目一 </option ><br /> <option value ="2" > 项目二 </option ><br /> </select ><br /> </form ><br /> <div id ="d" ></div ><br /> </body><br /> </html><br />
抱歉!评论已关闭.