ajax local refresh gridview for the data binding example

The specific code is as follows:

 <% @ 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( "  The student's name  " , typeof (System.String)));
    dt.Columns.Add( new System.Data.DataColumn( "  Chinese language and literature  " , typeof (System.Decimal)));
    dt.Columns.Add( new System.Data.DataColumn( "  mathematics  " , typeof (System.Decimal)));
    dt.Columns.Add( new System.Data.DataColumn( "  English  " , typeof (System.Decimal)));
    dt.Columns.Add( new System.Data.DataColumn( "  The computer  " , 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 ] = "  【 mencius E Chapter.  " + 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> project  " + Request.QueryString[ " id " ] + " </h2> " ;
      Header.Controls.Add(header);
      Header.RenderControl(htw);
      GridView1.RenderControl(htw);
      Response.Write( "  Here query data, output the result is ok. Results:  " + sb.ToString());
      Response.End();
    }
  }
   // /  Add the override void VerifyRenderingInServerForm(Control control) In order to avoid it  
   // /  Type" GridView "Control" GridView1 "Must be placed in having  runat=server  Inside the form tag.  
   // /  The abnormal  
  public override void VerifyRenderingInServerForm(Control control)
  { }
</ script > 
< html xmlns ="http://www.w3.org/1999/xhtml" > 
< head id ="Head1" runat ="server" > 
   < title >  use  AJAX , local refresh  GridView  Simple implementation of data binding  </ title > 
   < script type ="text/javascript" > 
     function GetData(p) {
      document.getElementById( " d " ).innerHTML = "  Reading data...  " ;
      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> Data operation error: </h2> " + h.responseText;
          }
        }
      }
      h.send( null );
    }
    alert( "  This tip only appears in number one 1 Second open page.  " );
   </ 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" >  project 1 </ option > 
     < option value ="2" >  project 2 </ option > 
   </ select > 
   </ form > 
   < div id ="d" ></ div > 
</ body > 
</ html >