热搜：编程 Python Microsoft 编程语言 C++

使用ajax局部刷新gridview进行数据绑定示例

发布时间：2023-02-27 19:11:07 来源：好代码

.

多人的饭局尽量少参加，因为难有真心的交流，多为应酬。多想什么是自己真正想要的东西，想不透就继续想。

具体代码如下：


<% @ 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 >