基于Ajax实现下拉框联动显示数据

本篇文章给大家介绍基于ajax实现下拉框联动显示数据,代码非常简单,需要的朋友可以参考下

公司做项目的时候,需要用到下拉框联动显示数据的功能,索性利用Ajax来实现,看到时间比较充裕,就没去找demo自己去想方法写了。纯自己的想法,有些可能比较弱智,希望不要见笑。

页面中的两个下拉列表框:

   所在学院:   所在专业: 

JS脚本代码:

 

我们将http请求发送给服务端的Handler.ashx进行处理。

 public class Handler : IHttpHandler { public void ProcessRequest(HttpContext context) { string type = context.Request.QueryString["type"]; if (type.Equals("college")) { string id = context.Request.QueryString["id"]; context.Response.ContentType = "text/plain"; context.Response.Write(getSpecialty(id));//这个是从数据库中根据传来省的id 查询出来的。学院的名字和主键,主键以便去查专业的名字 } } public string getSpecialty(string college) { DataSet ds = GetInformation.GetSpecialtyInfo(college); string str = ""; for (int i = 0; i 

根据学院的编号获得相应的专业,并将专业的名称用“|”分割组合成字符串返回给客户端,客户端脚本拆分字符串添加到下拉框中。

这里只是二级的联动显示,三级联动数据的现实原理是一样的。

本文的全部内容就到此结束了,希望大家学习Ajax实现下拉框联动显示数据有所帮助。

以上就是基于Ajax实现下拉框联动显示数据的详细内容,更多请关注易知道|edz.cc其它相关文章!

推荐阅读