技术开发 频道

ajax实现动态从数据库模糊查询显示到下拉框中(ajax方法返回Dataset的


【IT168技术文档】

  功能:在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>
0
相关文章