功能：在textbox中输入内容，动态从数据库模糊查询显示到下拉框中，以供选择
　　1.建立一aspx页面，html代码
　　<HTML>
　　 <HEAD>
　　 <title>WebForm1</title>
　　 <SCRIPT language="javascript">
　　 //城市------------------------------
　　 function cityResult()
　　 {
　　 var city=document.getElementById("TextBox1");
　　 WebForm1.GetCityList(city.value,get_city_Result_CallBack);
　　 }
　　
　　 function get_city_Result_CallBack(response)
　　 {
　　 if (response.value != null)
　　 {
　　 //debugger;
　　 document.getElementById("DropDownList1").style.display="block";
　　 document.getElementById("DropDownList1").length=0;
　　 var ds = response.value;
　　 if(ds != null && typeof(ds) == "object" && ds.Tables != null)
　　 {
　　 for(var i=0; i<ds.Tables[0].Rows.length; i++)
　　 {
　　 var name=ds.Tables[0].Rows[i].city;
　　 var id=ds.Tables[0].Rows[i].cityID;
　　 document.getElementById("DropDownList1").options.add(new Option(name,id));
　　 }
　　 }
　　 }
　　 else
　　 {
　　 document.getElementById("DropDownList1").style.display="none";
　　 }
　　 return
　　 }
　　
　　 function getData()
　　 {
　　 var province=document.getElementById("DropDownList1");
　　 var pindex = province.selectedIndex;
　　 var pValue = province.options[pindex].value;
　　 var pText = province.options[pindex].text;
　　 document.getElementById("<%=TextBox1.ClientID%>").innerText=pText;
　　 }
　　 </SCRIPT>
　　 </HEAD>
　　 <body>
　　 <form id="Form1" method="post" runat="server">
　　 <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
　　 <br>
　　 <asp:DropDownList ID="DropDownList1" runat="server" Width="192px" style="display:none"></asp:DropDownList>
　　 </form>
　　 </body>
　　</HTML>2.cs代码
　　using System;
　　using System.Collections;
　　using System.ComponentModel;
　　using System.Data;
　　using System.Drawing;
　　using System.Web;
　　using System.Web.SessionState;
　　using System.Web.UI;
　　using System.Web.UI.WebControls;
　　using System.Web.UI.HtmlControls;
　　using System.Data.SqlClient;
　　namespace ajaxselect
　　{
　　 /**//// <summary>
　　 /// Summary description for WebForm1.
　　 /// </summary>
　　 public class WebForm1 : System.Web.UI.Page
　　 {
　　 protected System.Web.UI.WebControls.TextBox TextBox1;
　　 protected System.Web.UI.WebControls.DropDownList DropDownList1;
　　
　　 private void Page_Load(object sender, System.EventArgs e)
　　 {
　　 Ajax.Utility.RegisterTypeForAjax(typeof(WebForm1));
　　 if (!Page.IsPostBack)
　　 {
　　 this.TextBox1.Attributes.Add("onchange", "cityResult();");
　　 this.DropDownList1.Attributes.Add("onclick", "getData();");
　　 }
　　 }
　　 Web Form Designer generated code#region Web Form Designer generated code
　　 override protected void OnInit(EventArgs e)
　　 {
　　 //
　　 // CODEGEN: This call is required by the ASP.NET Web Form Designer.
　　 //
　　 InitializeComponent();
　　 base.OnInit(e);
　　 }
　　
　　 /**//// <summary>
　　 /// Required method for Designer support - do not modify
　　 /// the contents of this method with the code editor.
　　 /// </summary>
　　 private void InitializeComponent()
　　 {
　　 this.Load += new System.EventHandler(this.Page_Load);
　　 }
　　 #endregion
　　 GetCityList#region GetCityList
　　 [Ajax.AjaxMethod(Ajax.HttpSessionStateRequirement.Read)]
　　 public DataSet GetCityList(int provinceid)
　　 {
　　 string sql = "select * from city where father like '%" + provinceid + "%'";
　　 return GetDataSet(sql);
　　 }
　　 #endregion
　　 GetDataSet#region GetDataSet
　　 public static DataSet GetDataSet(string sql)
　　 {
　　 string ConnectionString = System.Configuration.ConfigurationSettings.AppSettings["ConnectionString"];
　　 SqlDataAdapter sda = new SqlDataAdapter(sql, ConnectionString);
　　 DataSet ds = new DataSet();
　　 sda.Fill(ds);
　　 return ds;
　　 }
　　 #endregion
　　 }
　　}3.源代码下载
　　4.数据库脚本
　　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](王朝网络 wangchao.net.cn)

Ajax实现在textbox中输入内容，动态从数据库中模糊查询显示到下拉框中的更多相关文章

  1. JavaScript解决select下拉框中的内容太长显示不全的问题

    JavaScript解决select下拉框中的内容太长显示不全的问题 1.说明 有些情况下,select下拉框的内容过长,导致部分看不见: 现在通过鼠标事件,让下拉框中的内容显示完全 2.实现源码 & ...

  2. 利用js取到下拉框中选择的值

    现在的需求是:下拉框中要是选择加盟商让其继续选择学校,要是选择平台管理员则不需要选择学校.隐藏选择下拉列表. 选择枚举值: /// <summary> /// 平台角色 /// </ ...

  3. 让下拉框中同时显示Key与Value

    声明:原创作品,转载时请注明文章来自SAP师太技术博客( 博/客/园www.cnblogs.com):www.cnblogs.com/jiangzhengjun,并以超链接形式标明文章原始出处,否则将 ...

  4. jquery选中将select下拉框中一项后赋值给text文本框

    jquery选中将select下拉框中一项后赋值给text文本框,出现无法将第一个下拉框的value赋值给文本框 因为select默认选中第一项..在选择第一项时,便导致无法激发onchange事件. ...

  5. 快速解决js开发下拉框中blur与click冲突

    在开发中我们会经常遇到blur和click冲突的情况.下面叙述了开发中常遇到的"下拉框"的问题,并提供了两种解决方案. 一.blur和click事件简述 blur事件:当元素失去焦 ...

  6. JavaScript向select下拉框中加入和删除元素

    JavaScript向select下拉框中加入和删除元素 1.说明 a   利用append()方法向下拉框中加入元素 b   利用remove()方法移除下拉框中最后一个元素 2.设计源代码 < ...

  7. JavaScript向select下拉框中添加和删除元素

    JavaScript向select下拉框中添加和删除元素 1.说明 a   利用append()方法向下拉框中添加元素 b   利用remove()方法移除下拉框中最后一个元素 2.设计源码 < ...

  8. JavaScript获取select下拉框中的第一个值

    JavaScript获取select下拉框中的第一个值 1.说明 获取select下拉框中的第一个值 2.实现源码 <!DOCTYPE html PUBLIC "-//W3C//DTD ...

  9. Java-Selenium，获取下拉框中的每个选项的值，并随机选择某个选项

    今天逛51testing,看见有人问这个问题.现在以Select标签为例. 1.首先看页面中的下拉框,如图: 2.F12查看页面源代码,如下 <select class="form-c ...

随机推荐

  1. Event Sourcing - ENode（一）

    分布式系统 摩尔定律如果一直能实现,不管是涉及或者实现一个OLTP的系统,我们是不是都会轻松点,用硬件堆就可以了.但是现在硬件已经在求变了,那么我们也得求变,云的概念如此之火,本质就是设施虚拟化,也可 ...

  2. Qt on Android: Qt 5.3.0 公布，针对 Android 改进的说明

    5月20日本,Qt 官方博客宣布 Qt 5.3.0 公布! 这个版本号聚焦在性能.稳定性和可用性的提升上,与 5.1 / 5.2 相比有非常大提升. 5.3.0 的主要变化: 稳定能.可用性大大提升 ...

  3. 记录我第一次在Android开发图像处理算法的经历

    大概是四月底的时候.有人加我QQ问我是否做能做一些基于图像皮肤检測的算法, 主要是实现对皮肤六项指标: 1.      水分 2.      有份 3.      痤疮与痘痘 4.      色斑与肤 ...

  4. Tomcat通过JNDI方式链接MySql数据库

    原文:Tomcat通过JNDI方式链接MySql数据库 拷贝MySQL的JDBC驱动到Tomcat的lib路径下 配置全局数据源或者单个Web应用的局部数据源 局部数据源 在Tomcat的conf/C ...

  5. 83. 从视图索引说Notes数据库（上）

    索引是数据库系统重要的feature,不管是传统的关系型数据库还是时兴的NoSQL数据库,它攸关查询性能,因而在设计数据库时须要细加考量.然而,Lotus Notes隐藏技术底层.以用户界面为导向.追 ...

  6. CentOS 7安装配置Apache HTTP Server

    原文 CentOS 7安装配置Apache HTTP Server   RPM安装httpd # yum -yinstall httpd //安装httpd会自动安装一下依赖包: apr apr-ut ...

  7. ViewPager用法

    第一图:          页面中填充内容是随机关键词飞入和飞出动画效果,随后会更新,如今请先无视吧 ---2015-02-27--- 两年后最终更新了,网上都能搜到的,哎 无奈太懒http://bl ...

  8. HBase加Solr

    HBase加Solr 如何解决分布式系统数据事务一致性问题 (HBase加Solr) 摘要:对于所有的分布式系统,我想事务一致性问题是极其非常重要的问题,因为它直接影响到系统的可用性.本文以下所述所要 ...

  9. Android手游《》斗地主完整的源代码（支持单机和网络对战）

    Android手游<斗地主>完整的源代码(支持单机和网络对战)下载.一个很不错的源代码. 斗地主掌游是一个独特的国内社会斗地主棋牌游戏,之后玩家可以下载网上斗地主和全世界.掌游斗地主特点: ...

  10. bigdata_hiveserver2报错_thrift

    问题一: php客户端,链接hiveserver2 ,报错 如下 1: server.TThreadPoolServer (TThreadPoolServer.java:run(215)) - Err ...