功能:在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. 新秀翻译(两)——使用Java通用配置模板方法模式

    假设你发现你已经非常重码,你可能会考虑使用模板的方法来消除easy重复错误代码.下面是一个示例:以下两类,他完成了几乎相同的功能: 实例化并初始化一个Reader来读取CSV文件. 读取每一行并解析: ...

  2. 使用Xcode和Instruments调试解决iOS内存泄漏

    尽管iOS 5.0加入版本号之后ARC机制,由于相互引用关系是复杂的.内存泄漏可能仍然存在.于是,懂原理是非常重要的. 这里讲述在没有ARC的情况下,怎样使用Instruments来查找程序中的内存泄 ...

  3. git stash用法

    使用场景: 当前修改的代码还不足以提交commit,但又必须切换到其他分支,要想完成这样的操作就可以使用git stash git stash意思就是备份当前的工作区的内容,从最近的一次提交中读取相关 ...

  4. HTML5 Web SQL Database 与 Indexed Database 的 CRUD 操作

    http://www.ibm.com/developerworks/cn/web/1210_jiangjj_html5db/ 版权声明:本文博客原创文章,博客,未经同意,不得转载.

  5. 标准差(standard deviation)和标准错误(standard error)你能解释一下?

    by:ysuncn(欢迎转载,转载请注明原始消息) 什么是标准差(standard deviation)呢?依据国际标准化组织(ISO)的定义:标准差σ是方差σ2的正平方根.而方差是随机变量期望的二次 ...

  6. ASP.NET MVC+EF框架+EasyUI实现权限管理系列(6)- EF上下文实例管理

    原文:ASP.NET MVC+EF框架+EasyUI实现权限管理系列(6)- EF上下文实例管理 ASP.NET MVC+EF框架+EasyUI实现权限管系列 (开篇)   (1):框架搭建    ( ...

  7. 第21章 策略模式(Strategy Pattern)

    原文 第21章 策略模式(Strategy Pattern) 策略模式 导读:策略模式看完之后,大多数人都会感觉有点混了,包括我,感觉策略模式是一种OO思想的体现(纯属个人拙见). 概述:       ...

  8. [Linux]使用Clang实现代码静态分析

    1.按下开关Clang sudo apt-get install Clang 2.编写测试程序  memleak.c #include<stdio.h> #include<stdli ...

  9. 雅居乐在核心产品 &quot;决策&quot;

    2015.6.2 在武汉-- 这是一支谦卑且认真学习,又实实在在做产品的 "产品级敏捷团队". "产品级敏捷团队"--在产品版本号开发的生命周期中.均能共同高效 ...

  10. jquery 重复事件

    采用jquery时刻.其他活动均达到. 相反1对1的. 例如:onclick="$(document).keypress(function (key) {  if (key.keyCode ...