功能：在textbox中输入内容，动态从数据库模糊查询显示到下拉框中，以供选择
1.建立一aspx页面，html代码
1
<HTML>
2 <HEAD>
3 <title>WebForm1</title>
4 <SCRIPT language="javascript">
5 //城市------------------------------
6 function cityResult()
7
{
8
var city=document.getElementById("TextBox1");
9 WebForm1.GetCityList(city.value,get_city_Result_CallBack);
10
}
11
12 function get_city_Result_CallBack(response)
13 {
14 if (response.value != null)
15
{
16 //debugger;
17 document.getElementById("DropDownList1").style.display="block";
18 document.getElementById("DropDownList1").length=0;
19 var ds = response.value;
20 if(ds != null && typeof(ds) == "object" && ds.Tables != null)
21 {
22 for(var i=0; i<ds.Tables[0].Rows.length; i++)
23 {
24 var name=ds.Tables[0].Rows[i].city;
25 var id=ds.Tables[0].Rows[i].cityID;
26 document.getElementById("DropDownList1").options.add(new Option(name,id));
27
}
28 }
29 }
30 else
31 {
32 document.getElementById("DropDownList1").style.display="none";
33 }
34 return
35 }
36
37 function getData()
38 {
39 var province=document.getElementById("DropDownList1");
40 var pindex = province.selectedIndex;
41 var pValue = province.options[pindex].value;
42 var pText = province.options[pindex].text;
43
44 document.getElementById("<%=TextBox1.ClientID%>").innerText=pText;
45 }
46 </SCRIPT>
47 </HEAD>
48 <body>
49 <form id="Form1" method="post" runat="server">
50 <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
51 <br>
52 <asp:DropDownList ID="DropDownList1" runat="server" Width="192px" style="display:none"></asp:DropDownList>
53 </form>
54 </body>
55</HTML>
<HTML>2
<HEAD>3
<title>WebForm1</title>4
<SCRIPT language="javascript"> 5
//城市------------------------------6
function cityResult() 7
{ 
8
var city=document.getElementById("TextBox1");9
WebForm1.GetCityList(city.value,get_city_Result_CallBack);10
}11
12
function get_city_Result_CallBack(response)13
{14
if (response.value != null)15
{ 
16
//debugger;17
document.getElementById("DropDownList1").style.display="block";18
document.getElementById("DropDownList1").length=0; 19
var ds = response.value;20
if(ds != null && typeof(ds) == "object" && ds.Tables != null)21
{ 22
for(var i=0; i<ds.Tables[0].Rows.length; i++)23
{24
var name=ds.Tables[0].Rows[i].city;25
var id=ds.Tables[0].Rows[i].cityID;26
document.getElementById("DropDownList1").options.add(new Option(name,id));27
}28
}29
}30
else31
{32
document.getElementById("DropDownList1").style.display="none";33
} 34
return35
}36
37
function getData()38
{39
var province=document.getElementById("DropDownList1");40
var pindex = province.selectedIndex;41
var pValue = province.options[pindex].value;42
var pText = province.options[pindex].text; 43
44
document.getElementById("<%=TextBox1.ClientID%>").innerText=pText;45
}46
</SCRIPT>47
</HEAD>48
<body>49
<form id="Form1" method="post" runat="server">50
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>51
<br>52
<asp:DropDownList ID="DropDownList1" runat="server" Width="192px" style="display:none"></asp:DropDownList>53
</form>54
</body>55
</HTML>
2.cs代码
Code4.数据库脚本
CREATE TABLE [dbo].[city]( [id] [int] NOT NULL, [cityID] [nvarchar](6) COLLATE Chinese_PRC_CI_AS NULL, [city] [nvarchar](50) COLLATE Chinese_PRC_CI_AS NULL, [father] [nvarchar](6) COLLATE Chinese_PRC_CI_AS NULL, CONSTRAINT [PK_city] PRIMARY KEY CLUSTERED ( [id] ASC)WITH (IGNORE_DUP_KEY = OFF) ON [PRIMARY]) ON [PRIMARY]