jquery插件 autoComboBox 下拉框

问: 1.大家在做省市区下拉框联动,或者是产品分类联动,或者是部门联动等下拉框时怎么做? 是用ajaxpro.dll 还是jquery ajax呢??
答: 是,留下继续阅读.
否,跟帖回复你的方法
结论:每次重复劳动 重复创造联动的下拉框, 累,想死!! 读完本文 您也许可以找到更好的方法来实现 无限级(理论) 的联动下拉框,也许只要10秒钟就够了.
就这样,一个自动产生联动下拉框的插件诞生了...
本插件依赖于jquery1.4.2 最低版本自行测试.
废话完毕.
代码:
<div class="zldd-AutoComboBox" id="div_autoComboBox">
</div>
  调用方法:


复制代码 代码如下:

var data= [{ "id": 25, "text": "淮安分公司", "children": [{ "id": 26, "text": "办公室(行政人事培训)"}] }, { "id": 52, "text": "研发部" }, { "id": 53, "text": "财务部"}]
$("#div_autoComboBox").AutoComboBox({
cssClass: "autoComboBox",
nullDispaly: true,
//url: "ComboBoxTreeDept_Data.aspx",
//如果没有使用远程数据 则可以使用本地数据源 使用上面定义的data变量 注:如果url不为空时 优先使用远程数据源
// ps:只请求一次数据库,数据源将存放在客户端
data:data,
firstValue: [true, "==请选择==", "==请选择=="] //是否自动创建第一个值 这个值通常为 请选择 ,不限等
});

结果: 这样就一个无限级(理论) 的联动下拉框就出来了.. 如果你拷贝一下以上代码,修改一下url参数 10秒钟够了吧??? 注:关于json格式,包括名称,请自行转换,本源码也包含一个只针对本插件转换json的一个dll.
(引用后:
///dataset 数据源
///要显示text
///id,, 你懂的
///父id, 你也懂的
///忽略....
string treeJson = zlddEasyUiHelp.CreateTree.DataSetToTree(ds_department, "Dept_Name", "Dept_ID", "Dept_PId",false);
)
问:我怎么获取用户选择的值.?
答: 一句代码搞定,并支持多个参数重载


复制代码 代码如下:

$("#div1").ComboBoxGetValue([index],[ErrorFn]);
//可选参数说明:
//index,获取第几个下拉框的值,默认最后一个(如果不填写也是获取最后一个值)
// ErrorFn,获取值时遇到错误 如:假设现在是省市区联动,您要获取第三个下拉框(区),但是用户只选择到了市,这将会获取不到,那么将调用传递进去的方法
//该回调方法写法如下:
var ErrorFn = function () {
alert("错误了");
}

看到此处您是否会用了???如果不会,你懂的,回帖....
接下来说下"修改"功能
如:刚才用户选择了自己的 地址, 那么现在用户需要修改,用户刚才选择到了"区",我们要初始化联动下拉框 并且要设置区,市,省的默认值.
很简单: 在上面的代码加一句话(下方红色标注的代码)就会自动初始化带默认值的联动下拉框
例:


复制代码 代码如下:

$("#div_autoComboBox").AutoComboBox({
cssClass: "autoComboBox",
nullDispaly: true,
//url: "ComboBoxTreeDept_Data.aspx",
//如果没有使用远程数据 则可以使用本地数据源 使用上面定义的data变量 注:如果url不为空时 优先使用远程数据源
// ps:只请求一次数据库,数据源将存放在客户端
data:data,
defaultValue: 76,
firstValue: [true, "==请选择==", "==请选择=="] //是否自动创建第一个值 这个值通常为 请选择 ,不限等
});

关于"修改"功能的诞生背景,有兴趣的看...
话说本插件是不可以设置默认值的,也就是不能自初始化带默认值的下拉框
但是,由于一个美女诱惑我,说"你要弄出来,我就干嘛嘛",,具体干嘛,各位懂的....
到此介绍完毕
源码下载,/201012/yuanma/AutoComboBoxs.rar(已更新)

(源码只包括插件源码,转换json格式字符串的dll)
2011年1月4日17:12:39更新

版本 v1.1

更新内容

修复部分已知bug(如果子类没有顶级选项如"请选择" 造成第三级无法创建的问题)

增加获取选定项对象的方法

性能的优化

原文: http://www.cnblogs.com/337212522/archive/2010/12/21/1912381.html

时间: 2010-12-21

jQuery+easyui中的combobox实现下拉框特效

1.第一种写法:Input框中显示: 复制代码 代码如下: <input id="cc" class="easyui-combobox" name="name" data-options="valueField:'value',textField:'text',data:[{'value':'1','text':'java'},{'value':'2','text':'C#'}]"/> 2. 第二种用法,在list

ComboBox(下拉列表框)通过url加载调用远程数据的方法

ComboBox(下拉列表框) ComboBox(下拉列表框)常用属性: valueField: 基础数据值名称绑定到该下拉列表框.- 提交值 textField:基础数据字段名称绑定到该下拉列表框.-显示值 url:通过URL加载远程列表数据. mode:定义了当文本改变时如何读取列表数据.设置为'remote'时,下拉列表框将会从服务器加载数据.当设置为"remote"模式时,用户输入将被发送到名为'q'的HTTP请求参数到服务器检索新数据. 方法: clear:清除下拉列表框的值

Ext中下拉列表ComboBox组件store数据格式用法介绍

复制代码 代码如下: var p_years = new Ext.form.ComboBox( { fieldLabel : '统计年份', anchor : anchor_w, mode : 'remote', maxHeight:100, triggerAction : 'all', selectOnFocus : true, forceSelection : true, editable : false, //store :[['11', '2011'], ['12', '2012'],[

Extjs中ComboBoxTree实现的下拉框树效果(自写)

最近涉及到的一个项目中,需要实现ComboBoxTree的效果,首先,看看效果吧--  在Extjs中是没有这种效果的,所以得自己写,在网络上看了看别人的资料,自己再总结了一下,修改了一下,代码如下: 复制代码 代码如下: Ext.ux.TreeCombo = Ext.extend(Ext.form.ComboBox, { constructor: function (cfg) { cfg = cfg || {}; Ext.ux.TreeCombo.superclass.constructor.

c#构造ColorComboBox(颜色下拉框)

复制代码 代码如下: class ColorComboBox : ComboBox    {        /// <summary>        /// 当前选中色        /// </summary>        public Color SelectedColor        {            get { return Color.FromName(this.Text); }        }        /// <summary>     

WinForm实现为ComboBox绑定数据源并提供下拉提示功能

本文实例展示了WinForm实现为ComboBox绑定数据源并提供下拉提示功能,这是一个非常有实用价值的功能,具体实现方法如下: 主要功能代码如下: /// <summary> /// 为ComboBox绑定数据源并提供下拉提示 /// </summary> /// <typeparam name="T">泛型</typeparam> /// <param name="combox">ComboBox<

C# 重写ComboBox实现下拉任意组件的方法

一.需求 C#种的下拉框ComboBox不支持下拉复选框列表与下拉树形列表等,系统中需要用到的地方使用了第三方组件,现在需要将第三方组件替换掉. 二.设计 基本思路:重写ComboBox,将原生的下拉部分屏蔽,使用toolStripDropDown制作下拉弹出 三.问题解决 1. 问题:toolStripDropDown中放toolStripControlHost时会有边框产生,同时CheckedListBox的duck为full时底端会有很大空白 解决: toolStripControlHos

winform中的ListBox和ComboBox绑定数据用法实例

本文实例讲述了winform中的ListBox和ComboBox绑定数据用法.分享给大家供大家参考.具体实现方法如下: 本例实现将集合数据绑定到ListBox和ComboBox控件,界面上显示某个属性的内容,代码如下: 复制代码 代码如下: //... //自定义了Person类(有Name,Age,Heigth等属性) List<Person> persons=new List<Person>(); persons.Add(new Person("WuMiao"

C# DataGridView绑定数据源的方法

开始以前,先认识一下WinForm控件数据绑定的两种形式,简单数据绑定和复杂数据绑定. 1. 简单的数据绑定 例1 using (SqlConnection conn = new SqlConnection(ConfigurationManager.ConnectionStrings["connStr"].ToString())) { SqlDataAdapter sda = new SqlDataAdapter("Select * From T_Class Where F_

DropDownList控件绑定数据源的三种方法

本文给大家分享web  中 DropDownList绑定数据源的几种方式,先给大家分享三种常见的方式,具体详情如下所示:  第一种 this.ddltype.DataTextField = "btName";//显示的值 this.ddltype.DataValueField = "btId";//获取dropdownlist中的值 ddltype.DataSource = service.GetBusinessTypeAll(""); this

一个可绑定数据源的jQuery数据表格插件

固定表头 列宽可调整 单击列头可排序 双击单元格可编辑 可绑定数据源 看下效果吧:HTML - 模板代码: 复制代码 代码如下: <table id="test"> <tr class="header"> <td style="width: 100px;" sort='true'> 姓名 </td> <td style="width: 100px;" sort='true'

C#如何利用反射将枚举绑定到下拉框详解

前言: 反射(Reflection)是.NET提供给开发者的一个强大工具,尽管作为.NET框架的使用者,很多时候不会用到反射.但在一些情况下,尤其是在开发一些基础框架或公共类库时,使用反射会使系统架构更加灵活. 在开发中,我们常常会遇到比如有些状态值在定义好后几乎从不改动,这时候使用数据库就显得有些多余了.首先想到的一个办法可能是在程序中创建一个数组来表示,此时,我们遇到了使用数组可能带来的第一个问题:不方便使用.当数组结构变更时,可能意味着所有使用过此数组的地方的索引都发生了变更,这是我们不想

Android Studio绑定下拉框数据详解

效果显示: 1.页面xml代码(项目的代码,直接复制会有错,自己修改一下就好) <TextView android:id="@+id/consultation_tv_section" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_above="@+id/consultation_et_doctor&qu

自定义Angular指令与jQuery实现的Bootstrap风格数据双向绑定的单选与多选下拉框

先说点闲话,熟悉Angular的猿们会喜欢这个插件的. 00.本末倒置 不得不承认我是一个喜欢本末倒置的人,学生时代就喜欢先把晚交的作业先做,留着马上就要交的作业不做,然后慢悠悠做完不重要的作业,卧槽,XX作业马上要交了,赶紧补补补.如今做这个项目,因为没找到合适的多选下拉Web插件,又不想用html自带的丑陋的<select multiple></select>,自己花了一整天时间做了一个.或许这样占用的主要功能开发的时间,开发起来会更有紧迫感吧.感觉自己是个抖M自虐倾向,并且伴