Ajax簡(jiǎn)單示例之改變下拉框動(dòng)態(tài)生成表格



          1.建立一個(gè)aspx頁(yè)面,html代碼
          <html xmlns="http://www.w3.org/1999/xhtml" >
          <head runat="server">
              <title>Untitled Page</title>
              <script type="text/javascript">
                  var xmlHttp;

                  function createXMLHttpRequest() 
                  {
                      if (window.ActiveXObject) 
                      {
                          xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
                      } 
                      else if (window.XMLHttpRequest) 
                      {
                          xmlHttp = new XMLHttpRequest();
                      }
                  }
                      
                  function startRequest() 
                  {
                      //debugger;
                      var ProvinceID=document.getElementById("DropDownList1");           
                      createXMLHttpRequest();
                      xmlHttp.onreadystatechange = handleStateChange;
                      xmlHttp.open("GET", "?ProvinceID="+ProvinceID.value, true);
                      xmlHttp.send(null);
                  }
                      
                  function handleStateChange() 
                  {
                      if(xmlHttp.readyState == 4) //0(未初始化);1(正在裝載);2 (裝載完畢);3 (交互中);4 (完成) 
                      {
                          if(xmlHttp.status == 200) //200(OK);404(not found)
                          {
                              document.getElementById("gridiv").innerHTML=xmlHttp.responseText;
                          }
                      }
                  }
                  </script>
          </head>
          <body>
              <form id="form1" runat="server">
              <div>
                  <asp:DropDownList ID="DropDownList1" runat="server">
                  </asp:DropDownList>   
              </div>
              <div id ="gridiv"></div>
              </form>
          </body>
          </html>
          2.cs代碼
          using System.Data.SqlClient;

          protected void Page_Load(object sender, EventArgs e)
              {
                  if (!Page.IsPostBack)
                  {
                      this.DropDownList1.Attributes.Add("onchange", "return startRequest();");
                      ListProvince();
                      if (ProvinceID != "")
                      {
                          GetCityByProvinceID(ProvinceID);
                      }
                  }
              }

              property#region property
              private string ProvinceID
              {
                  get
                  {
                      if (Request["ProvinceID"] != null && Request["ProvinceID"].ToString() != "")
                      {
                          return Request["ProvinceID"];
                      }
                      else
                      {
                          return "";
                      }
                  }
              }
              #endregion

              GetDataSet#region GetDataSet
              private DataSet GetDataSet(string sql)
              {
                  string constring=System.Configuration.ConfigurationSettings.AppSettings["ConnectionString"];
                  SqlDataAdapter    sda =new SqlDataAdapter(sql,constring);
                  DataSet ds=new DataSet();
                  sda.Fill(ds);
                  return ds;
              }
              #endregion

              GetCityByProvinceID#region GetCityByProvinceID
              private void GetCityByProvinceID(string ProvinceID)
              {
                  string connStr = ConfigurationSettings.AppSettings["ConnectionString"];
                  SqlConnection conn = new SqlConnection(connStr);
                  string sql = "select * from city where father='" + ProvinceID + "'";
                  SqlCommand cmd = new SqlCommand(sql, conn);
                  conn.Open();
                  SqlDataReader dr = cmd.ExecuteReader();

                  string s = @"<table cellspacing='0' cellpadding='4' border='0' id='GridView1' style='color:#333333;border-collapse:collapse;'>";
                  s+="<tr style='color:White;background-color:#990000;font-weight:bold;'>";
                      s+="<th scope='col'>流水號(hào)</th><th scope='col'>代號(hào)</th><th scope='col'>城市</th></tr>";
                  int m = 0;
                  while (dr.Read())
                  {
                      if (m % 2 == 0)
                      {
                          s += "<tr style='color:#333333;background-color:#FFFBD6;'>";
                      }
                      else
                      {
                          s += "<tr style='color:#333333;background-color:White;'>";
                      }
                      m++;
                      s += "<td>" + dr["id"] + "</td>";
                      s += "<td>" + dr["cityID"] + "</td>";
                      s += "<td>" + dr["city"] + "</td>";
                      s += "</tr>";
                  }        
                  s+="</table>";
                  dr.Close();
                  conn.Close();
                  this.Response.Write(s);
                  this.Response.End();
              }
              #endregion

              ListProvince#region ListProvince
              private void ListProvince()
              {
                  string sql = "select * from province";
                  DataSet ds = GetDataSet(sql);
                  DropDownList1.DataSource = ds;
                  DropDownList1.DataTextField = "province";
                  DropDownList1.DataValueField = "provinceID";
                  DropDownList1.DataBind();
              }
              #endregion
          3.示例數(shù)據(jù)庫(kù)下載area1.rar

          posted on 2007-06-20 13:26 chenguo 閱讀(345) 評(píng)論(0)  編輯  收藏 所屬分類: AJAX Dev

          <2025年7月>
          293012345
          6789101112
          13141516171819
          20212223242526
          272829303112
          3456789

          導(dǎo)航

          統(tǒng)計(jì)

          留言簿

          隨筆分類(1)

          文章分類(52)

          好友 小山的博客

          最新隨筆

          最新評(píng)論

          主站蜘蛛池模板: 颍上县| 阳新县| 英德市| 攀枝花市| 普定县| 马关县| 延庆县| 蒙城县| 新龙县| 广德县| 东阿县| 禹州市| 西华县| 微山县| 砀山县| 新河县| 沭阳县| 进贤县| 延庆县| 新平| 奉化市| 白沙| 郯城县| 扶余县| 三穗县| 高要市| 邵武市| 隆德县| 宁阳县| 靖州| 阳谷县| 隆尧县| 梅州市| 天水市| 绥宁县| 大城县| 湘阴县| 黔江区| 昭觉县| 西昌市| 隆德县|