如:
xmlhttp.open("GET","OhTypeGet.aspx?type=1&bigctg="+escape(big),false);
1 function load()
2 {
3 var drp2 = document.all("typesmall");
4 drp2.innerText="";
5 for(var i = 0;i<=drp2.options.length -1;i++)
6 {
7 drp2.remove(i);
8 }
9
10 var drp3 = document.all("typemicro");
11 for(var i = 0;i<=drp3.options.length -1;i++)
12 {
13 drp3.remove(i);
14 }
15
16 var xmlhttp = new ActiveXObject("MSXML2.XMLHTTP");
17 var oDoc = new ActiveXObject("MSXML2.DOMDocument");
18
19 var big = document.all("typebig").value;
20
21
22 xmlhttp.open("GET","TypeGet.aspx?type=1&bigctg="+escape(big),false);
23
24 xmlhttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded;charset=utf-8"); //设定内容的编码形式
25
26 xmlhttp.send("");
27
28 oDoc.loadXML(xmlhttp.responseText);
29
30
31 var items1 = oDoc.selectNodes("//type/Table1/LITTLE_CTG");
32 var items2 = oDoc.selectNodes("//type/Table1/LITTLE_CTG");
33
34
35 var itemsLength=items1.length;
36 for(i=0;i<itemsLength;i++)
37 //将小类的类名和编号赋予DropDownList2
38 {
39 var newOption = document.createElement("OPTION");
40 newOption.text=items2[i].text;
41 newOption.value=items1[i].text;
42 drp2.options.add(newOption);
43 }
44
45
46
47 }
48
49
50 function loadlittle()
51 {
52
53 var drp3 = document.all("typemicro");
54 for(var i = 0;i<=drp3.options.length -1;i++)
55 {
56 drp3.remove(i);
57 }
58
59 var xmlhttp = new ActiveXObject("MSXML2.XMLHTTP");
60 var oDoc = new ActiveXObject("MSXML2.DOMDocument");
61
62 var big = document.all("typebig").value;
63 var little = document.all("typesmall").value;
64
65
66 xmlhttp.open("GET","TypeGet.aspx?type=2&bigctg="+escape(big)+"&littlectg="+escape(little),false);
67
68 xmlhttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded;charset=utf-8"); //设定内容的编码形式
69
70 xmlhttp.send("");
71
72 oDoc.loadXML(xmlhttp.responseText);
73
74
75 var items1 = oDoc.selectNodes("//Ohtype/Table1/DETAIL_CTG");
76 var items2 = oDoc.selectNodes("//Ohtype/Table1/DETAIL_CTG");
77
78
79 var itemsLength=items1.length;
80 for(i=0;i<itemsLength;i++)
81 //将小类的类名和编号赋予DropDownList2
82 {
83 var newOption = document.createElement("OPTION");
84 newOption.text=items2[i].text;
85 newOption.value=items1[i].text;
86 drp3.options.add(newOption);
87 }
88
89
90 }
页面的下拉框,使用的是服务器端的DROPDOWNLIST2 {
3 var drp2 = document.all("typesmall");
4 drp2.innerText="";
5 for(var i = 0;i<=drp2.options.length -1;i++)
6 {
7 drp2.remove(i);
8 }
9
10 var drp3 = document.all("typemicro");
11 for(var i = 0;i<=drp3.options.length -1;i++)
12 {
13 drp3.remove(i);
14 }
15
16 var xmlhttp = new ActiveXObject("MSXML2.XMLHTTP");
17 var oDoc = new ActiveXObject("MSXML2.DOMDocument");
18
19 var big = document.all("typebig").value;
20
21
22 xmlhttp.open("GET","TypeGet.aspx?type=1&bigctg="+escape(big),false);
23
24 xmlhttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded;charset=utf-8"); //设定内容的编码形式
25
26 xmlhttp.send("");
27
28 oDoc.loadXML(xmlhttp.responseText);
29
30
31 var items1 = oDoc.selectNodes("//type/Table1/LITTLE_CTG");
32 var items2 = oDoc.selectNodes("//type/Table1/LITTLE_CTG");
33
34
35 var itemsLength=items1.length;
36 for(i=0;i<itemsLength;i++)
37 //将小类的类名和编号赋予DropDownList2
38 {
39 var newOption = document.createElement("OPTION");
40 newOption.text=items2[i].text;
41 newOption.value=items1[i].text;
42 drp2.options.add(newOption);
43 }
44
45
46
47 }
48
49
50 function loadlittle()
51 {
52
53 var drp3 = document.all("typemicro");
54 for(var i = 0;i<=drp3.options.length -1;i++)
55 {
56 drp3.remove(i);
57 }
58
59 var xmlhttp = new ActiveXObject("MSXML2.XMLHTTP");
60 var oDoc = new ActiveXObject("MSXML2.DOMDocument");
61
62 var big = document.all("typebig").value;
63 var little = document.all("typesmall").value;
64
65
66 xmlhttp.open("GET","TypeGet.aspx?type=2&bigctg="+escape(big)+"&littlectg="+escape(little),false);
67
68 xmlhttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded;charset=utf-8"); //设定内容的编码形式
69
70 xmlhttp.send("");
71
72 oDoc.loadXML(xmlhttp.responseText);
73
74
75 var items1 = oDoc.selectNodes("//Ohtype/Table1/DETAIL_CTG");
76 var items2 = oDoc.selectNodes("//Ohtype/Table1/DETAIL_CTG");
77
78
79 var itemsLength=items1.length;
80 for(i=0;i<itemsLength;i++)
81 //将小类的类名和编号赋予DropDownList2
82 {
83 var newOption = document.createElement("OPTION");
84 newOption.text=items2[i].text;
85 newOption.value=items1[i].text;
86 drp3.options.add(newOption);
87 }
88
89
90 }
<asp:dropdownlist id="Ohtypebig" runat="server" Height="20px" Width="120px" CssClass="drplist" >
</asp:dropdownlist> <asp:dropdownlist id="Ohtypesmall" runat="server" Height="20px" Width="150px" CssClass="drplist">
</asp:dropdownlist>
<asp:dropdownlist id="Ohtypemicro" runat="server" Height="20px" Width="150px" CssClass="drplist">
</asp:dropdownlist></td>
在页面初始加载的时候位BIG和LITTLE添加onchange事件</asp:dropdownlist> <asp:dropdownlist id="Ohtypesmall" runat="server" Height="20px" Width="150px" CssClass="drplist">
</asp:dropdownlist>
<asp:dropdownlist id="Ohtypemicro" runat="server" Height="20px" Width="150px" CssClass="drplist">
</asp:dropdownlist></td>
this.typebig.Attributes.Add("onchange", "load()"); this.typesmall.Attributes.Add("onchange","loadlittle()");
到此,请求页的处理差不多就这样了,下面做些说明-----------------------------------------
在服务页,也就是请求页请求的
xmlhttp.open("GET","TypeGet.aspx?type=1&bigctg="+escape(big),false);
TypeGet.aspx页面
此页面在接收参数的时候处理完要处理的动作后,输出内容给请求页,也就是Response。
protected void Page_Load(object sender, EventArgs e)
{
DataTable dt = null;
DataTable senddt = null;
DataSet ds = null;
string big = this.Request["bigctg"].ToString();
string type = this.Request["type"].ToString();
if (Cache["AllOhtype"] == null)
{
dt = 这里你要取到一个表
//缓存这个表,这样就不用每次请求都连数据哭
Cache["AllOhtype"] = dt;
}
ds = new DataSet("Ohtype");
if (type == "1")
{
senddt = (DataTable)Cache["AllOhtype"];
senddt.DefaultView.RowFilter = "BIG_CTG='" + big + "'";
senddt = senddt.DefaultView.ToTable();
senddt.Rows.Add(senddt.NewRow(),0);
ds.Tables.Add(senddt);
ds.WriteXml(Response.OutputStream);
}
else
{
if (type == "2")
{
string little = this.Request["littlectg"].ToString();
senddt = (DataTable)Cache["AllOhtype"];
senddt.DefaultView.RowFilter = "BIG_CTG='" + big + "' AND LITTLE_CTG='"+ little +"'";
senddt = senddt.DefaultView.ToTable();
senddt.Rows.Add(senddt.NewRow(), 0);
ds.Tables.Add(senddt);
ds.WriteXml(Response.OutputStream);
}
}
Response.Flush();
Response.End();
}
{
DataTable dt = null;
DataTable senddt = null;
DataSet ds = null;
string big = this.Request["bigctg"].ToString();
string type = this.Request["type"].ToString();
if (Cache["AllOhtype"] == null)
{
dt = 这里你要取到一个表
//缓存这个表,这样就不用每次请求都连数据哭
Cache["AllOhtype"] = dt;
}
ds = new DataSet("Ohtype");
if (type == "1")
{
senddt = (DataTable)Cache["AllOhtype"];
senddt.DefaultView.RowFilter = "BIG_CTG='" + big + "'";
senddt = senddt.DefaultView.ToTable();
senddt.Rows.Add(senddt.NewRow(),0);
ds.Tables.Add(senddt);
ds.WriteXml(Response.OutputStream);
}
else
{
if (type == "2")
{
string little = this.Request["littlectg"].ToString();
senddt = (DataTable)Cache["AllOhtype"];
senddt.DefaultView.RowFilter = "BIG_CTG='" + big + "' AND LITTLE_CTG='"+ little +"'";
senddt = senddt.DefaultView.ToTable();
senddt.Rows.Add(senddt.NewRow(), 0);
ds.Tables.Add(senddt);
ds.WriteXml(Response.OutputStream);
}
}
Response.Flush();
Response.End();
}
这时候需要修改 enableEventValidation="false"
如果运行之后,会出现一个错误,是在处理的时候
回发或回调参数无效。 在配置中使用 <pages enableEventValidation="true"/> 或在页面中使用 <%@ Page EnableEventValidation="true" %> 启用了事件验证。出于安全目的,此功能验证回发或回调事件的参数是否来源于最初呈现这些事件的服务器控件。
这时候需要修改 enableEventValidation="false"
但是好象这不是最好的解决方法
还要把联动处理过的控件修改成运行于服务端的HTML控件,如
<select name="Ohtypesmall" id="Ohtypesmall" runat="server">
<option value="0">=请选择=</option>
</select>
然后在CS页面取值的时候用:
Request.Form["DDLcity"];
事件验证是。NET 2。0新加的功能