Ajax简单示例之改变下拉框动态生成表格

1.建立一个aspx页面,html代码html xmlns=http://www.w3.org/1网络
强烈推介IDEA2020.2破解激活,IntelliJ IDEA 注册码,2020.2 IDEA 激活码

1.建立一个aspx页面,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);
            }

        }

    }



    


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

            
else
            
{
                
return "";
            }

        }

    }

    
#endregion



    


#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



    


#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'>流水号</th><th scope='col'>代号</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



    


#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.示例数据库下载
area1.rar

 

本文来源21aspnet,由架构君转载发布,观点不代表Java架构师必看的立场,转载请标明来源出处:https://javajgs.com/archives/2840

发表评论