其实原理也很简单,分成两个部分,一个是服务器端,一个是客户端。

  首先要设置记录集,这里用DataSet来装载,二级联动,里面就要有两个DataTable;三级联动,里面就要有三个DataTable。同理,n级联动就要有n个DataTable。

  然后用第一个DataTable来绑定第一个DropDownList。第一个DropDownList是固定生成的,其他的DropDownList则是根据级数动态new出来的。

  服务器端会根据联动级数来动态创建下拉列表框。就是这样:lst = new MyDropDownList();这样呢,做一个循环,有n级就new出来n-1个。然后在设置一些属性,根据上一个DropDownList的第一个选项,作为过滤条件,绑定控件。这样第一次的显示工作就完成了。

for (i = 1; i < ds_List.Tables.Count; i++)
                {
                    dv = ds_List.Tables[i].DefaultView;

#region 绑定其他的列表框
                    //获取过滤条件
                    dv.RowFilter = "ParentID=" + ParentID;

//定义新的下拉列表框
                    lst = new MyDropDownList();
                    lst.EnableViewState = true;

lst.ID = "lst" + i;
                    lst.DataTextField = "txt";
                    lst.DataValueField = "id";

if (str_HTML.Length > 2 * i)
                        this.Controls.Add(new LiteralControl(str_HTML[2 * i]));

//添加下拉列表框
                    this.Controls.Add(lst);
                    if (str_HTML.Length > 2 * i + 1)
                        this.Controls.Add(new LiteralControl(str_HTML[2 * i + 1]));

lst.DataSource = dv;
                    lst.DataBind();

//设置父ID。第一次访问,取下拉列表框的第一个选项的值
                    if (dv.Count > 0)
                        ParentID = dv[0][1].ToString();
                    else
                        ParentID = "-9999";

#endregion
                }

  然后要输出一个js的数组,当初不会json,也不喜欢xml,所以就用数组来装载了。把这个数组输出到页面里。然后客户端的js就可以访问到需要的数据了。

  下面说一下客户端。客户端是通过js的onchange函数实现联动,原理呢就是“递归”。写两个js函数就搞定了,一个是入口函数(lst_change),另一个是结束函数(lstSelected)。

  当第一个下拉列表框触发了onchange函数(lst_change)的时候,会根据用户的选项对下一个下拉列表框的item进行设置,然后判断一下是否有下下一个下拉列表框,有的话递归调用lst_change(),没有的话调用结束函数(lstSelected)。

  这样不管有多少个下拉列表框,都可以用这两个js函数搞定。

  注意点:

  1、由于用的是服务器控件DropDownList,他有一个“特点”,那就是在客户端用js设置的item,在服务器端都是不承认的。为了解决这个问题,我用了一个奔办法,加了一个文本框,用这个文本框来保存客户的选项。然后提交表单,根据这个文本框里的内容来确定客户选择了哪些选项。

  

  原来基本就是这样。然后打算引入jQuery和json来简化一下代码,再然后看看能不能做成纯客户端的,就是不用服务器控件了,直接使用 html的input。

  

【自然框架】n级下拉列表框的原理相关推荐

  1. 【自然框架 NatureFW】里的两种“映射”方式

    自然框架里面采用了两种映射关系,一个是流行的ORM,另一是非主流的"CCM " (我自己想的,呵呵). 先说一下ORM.ORM是O和R的映射关系.也看到很多人写关于ORM的文章,发 ...

  2. 【自然框架】之“元数据”的威力

    定义       元数据最本质.最抽象的定义为:data about data (关于数据的数据).它是一种广泛存在的现象,在许多领域有其具体的定义和应用. 我的理解就是对数据进行说明.描述.不知道我 ...

  3. 【自然框架】——思路、结构、特点的介绍(初稿,欢迎大家多提意见)

    开场白 面向过程:面向过程是"写代码",根据客户提出来的需求来写代码,包括函数.一步一步的写,都写完了,功能也就实现了. 面向对象:面向对象是"做设计",先不考 ...

  4. 调用其他app 的lib_ButterKnife执行效率为什么比其他注入框架高?它的原理是什么...

    面试官: ButterKnife为什么执行效率为什么比其他注入框架高?它的原理是什么 心理分析: ButterKnife框架一直都是使用,很少又开发者对butterknife深入研究的,既然你是面试A ...

  5. 滨州学院计算机自荐考试题型,滨州学院2004—2005学年第一学期期末考试计算机科学教育专业02级《数据库原理》试题及答案(3份,另附习题集)...

    内容简介: 滨州学院2004-2005学年第一学期期末考试计算机科学教育专业02级<数据库原理>试题及答案(3份) <数据库原理>模拟试题一 一.选择题(每题1分,共5分) 1 ...

  6. 【自然框架】稳定版的Demo——看点二:权限,权限过滤与验证。

    建议先看看 上一篇:[自然框架]稳定版beta1--源码下载,Demo说明 下载地址:还是老地方,自然框架的源代码.Demo.数据库.配置信息管理程序下载(2010.01.25更新) 在线演示:htt ...

  7. 【自然框架】稳定版beta1——源码下载,Demo说明

    在线演示:http://demo.naturefw.com/ 开源协议 一直想说来着,可是总忘.开源协议采用 BSD开源协议. 一直在说开源,但只是把源码放出来了,连个开源协议都没说,虽然说了也基本等 ...

  8. 牛逼哄哄的 RPC 框架,底层到底什么原理?

    1. RPC框架的概念 RPC(Remote Procedure Call)–远程过程调用,通过网络通信调用不同的服务,共同支撑一个软件系统,微服务实现的基石技术. 使用RPC可以解耦系统,方便维护, ...

  9. 【自然框架】——重开在线演示

    以前的那个在线演示的空间和域名过期了(感谢"云淡风清"和"恭敬"提供域名.空间和数据库),想想还是自己弄个空间来的稳定一些.所以买了个空间,交了一年的钱,所以至 ...

最新文章

  1. CentOS7.2 安装Squid3.5及正、反向代理设置
  2. 关于UIView的userInteractionEnabled属性
  3. cdf2rdf--复对角矩阵转化为实对角矩阵
  4. Eigen入门之密集矩阵 4 - 块操作
  5. ProSolid下的遍历访问封装代码
  6. python课设总结_Python技术分享课总结:用Python模拟知乎自动登录
  7. 二、Merge sort
  8. 主管好当:一不指点工作,二不检查工作,三不改正错误
  9. c++代码打印爱心图(适用初学者)
  10. 关于Jqueryweui 的select联动用法
  11. 人工智能和机器学习 AIML howto
  12. 智慧屏如何连接电视盒子
  13. 如何做将两张图片合二为一
  14. powerpoint和word内使用latex编辑公式
  15. 软件工程导论04-设计工程
  16. android 耳机检测,android 检测耳机是否插入方法
  17. 记录导出微信聊天记录到硬盘的过程
  18. 通过路由器绕过DDoS防御攻击web服务器总结
  19. 趣味编程:从字符串中提取信息
  20. ps aux排序 (查看进程占用内存和cpu)

热门文章

  1. linux命令80字符,Linux终端:用cat命令查看不可见字符
  2. c语言编程发展史详细介绍,一张图让你了解编程语言发展史
  3. mysql 安装在路由器_MySQL如何安装?安装MySQL数据库的三种方法
  4. 设计一个采用udp实现数据传输的程序_TCP/IP、UDP、HTTP、MQTT、CoAP这五种物联网协议...
  5. mysql的读写分离技术_mysql 读写分离方法
  6. mvc razor html.list,NetCore Web应用开发-HTML,C#,Razor补充
  7. oracle删除的数据没有commit,在Oracle中误删除数据后并commit后的数据恢复办法
  8. springmvc连接mysql_挺详细的spring+springmvc+mybatis配置整合|含源代码
  9. dell4528s linux_如何在戴尔PC上使用Ubuntu Linux终端
  10. Windows下VB6.0开发——VB程序断点调试与顺序执行不一致问题(通信原因)