多选下拉框

1.下载地址

https://github.com/davidstutz/bootstrap-multiselect

2.文档地址:

http://davidstutz.github.io/bootstrap-multiselect/#known-issues

3.使用方法如下:

<!-- Build your select: -->
<select id="test" class="multiselect" multiple="multiple">
  <option value="1">Cheese</option>
  <option value="2">Tomatoes</option>
  <option value="3">Mozzarella</option>
  <option value="4">Mushrooms</option>
  <option value="5">Pepperoni</option>
  <option value="6">Onions</option>
</select>

<script type="text/javascript">
  $(document).ready(function() {
    $(‘#test‘).multiselect();
  });
</script>

4.可以给选择框设置一些参数

nonSelectedText: ‘请选择‘,

allSelectedText: ‘全部‘,

includeSelectAllOption: true,

selectAllText: ‘全部‘

5.得到值

$(‘#test‘).val()

6.得到name,暂时没发现方法,自己写了下。

buttonTitle: function(options, select) {
        	var selected = ‘‘;
            options.each(function () {
              selected += $(this).text() + ‘, ‘;
            });
            $(‘#test_name‘).val(selected.substr(0, selected.length - 2));
        	return selected.substr(0, selected.length - 2);
	    }

7.低版本的jquery会导致id不能正确获取的问题,可以用上面获取name的办法得到id.添加一个隐藏域,将id赋值给隐藏域,不要直接给选择框的id赋值,会出现问题

相关代码下载:http://pan.baidu.com/s/1mgsyCNe

时间: 2024-08-15 01:50:43

多选下拉框的相关文章

query多选下拉框插件 jquery-multiselect(修改)

其实网上关于该控件的使用教程已经很多了,其中 query多选下拉框插件 jquery-multiselect Jquery多选下拉列表插件jquery multiselect功能介绍及使用 这2个的介绍已经比较详细了,尤其是第二个有扩展MyValues函数,只是扩展有些bug,这里我在提出一些我的扩展,我们应该把multiValues属性定义在options里面,让每个multiselect控件都有自己的multiValues属性.我这里还需要一个获取text的方法.有关Myvalues和Myt

多选下拉框带搜索(aps.net)

自己写了一个带搜索功能的多选下拉框,为了要获取值,就没有封装插件,实现思路 1.一个文本框 做搜索 2.一个文本框显示选中文本,一个隐藏控件存值 3.一个div里面绑定CheckBoxList控件(这里,你也可以请求后直接插入checkbox) 代码 1.一个变量把div的html存起来 2.选中就加到文本框,取消就减掉 //选中记录,反选删除 $("#divChkList :checkbox").each(function () { $(this).click(function ()

Html 多选下拉框

1.css文件 span.dropList {display:inline-block; height:20px;border:1px solid #ccc;  cursor:pointer; background:url(../images/xj.png) #fff no-repeat center right; font-size:12px; line-height:20px;padding-right:10px; position:relative;} span.dropList .Che

页面多选下拉框 jquery.multiple.select

1.首先引用jquery.multiple.select.js.multiple-select.css 2.在页面select下拉列表里面加一个multiple="multiple" <select name="nimbusHost" id="nimbusHost" multiple="multiple"> <c:forEach items="${stormIps}" var="

Extjs4.2 多选下拉框

//多选下拉框 Ext.define('MDM.view.custom.MultiComboBox', { extend: 'Ext.form.ComboBox', alias: 'widget.multicombobox', xtype: 'multicombobox', initComponent: function() { this.multiSelect = true; this.listConfig = { itemTpl: Ext.create('Ext.XTemplate', '<

ExtJs5.1多选下拉框CheckComb

ExtJs这么多个版本了,可就是不提供多选下拉框,老外不用这个玩意吗? 5都出来这么久了,新写的项目就用5吧,把以前Extjs4.2的时搜到前人的CheckComb改巴改巴,能用了就赶紧贴上来,没有仔细测试各种情况. Ext.define('Ext.ux.CheckCombo', { extend : 'Ext.form.field.ComboBox', alias : 'widget.checkcombo', multiSelect : true, allSelector : false, n

MVC实现多选下拉框

借助Chosen Plugin可以实现多选下拉框. 选择多项: 设置选项数量,比如设置最多允许2个选项: 考虑到多选下拉<select multiple="multiple"...></select>选中项是string数组,Model应该这样设计: using System.Collections.Generic; using System.Web.Mvc; namespace MvcApplication1.Models { public class Car

c# 复选下拉框

引用dll: http://pan.baidu.com/s/1qXa97UO 自定义类: namespace TMI_S { /// <summary> /// 功能描述:自定义多选下拉框 /// 作 者:huangzh /// 创建日期:2016-01-04 11:57:13 /// 任务编号: /// </summary> public class MultiComboBox : ComboBox { public TreeView lst = new TreeView();

自定义SWT控件二之自定义多选下拉框

2.自定义下拉多选框 package com.view.control.select; import java.util.ArrayList; import java.util.HashMap; import java.util.LinkedHashMap; import java.util.List; import java.util.Map; import org.eclipse.swt.SWT; import org.eclipse.swt.custom.CLabel; import or

select2的多选下拉框上传

1.加入multiple: true,属性实现多选下拉框样式 2.下拉框选择后的值是数组类型不要经过数据处理才能进行表单提交 提交的时候原下拉框所在的标签不提交,而是将多选后的值存入页面中的一个隐藏标签中,将这个隐藏标签进行提交 提交时获取选中的下拉框的所有的值,并遍历这些值,将这些值分别以(值 逗号)的形式存入一个变量中,并在遍历完成后去掉最后一个逗号, 最终的格式类似  1,4,6,7 这样 页面初始化时,假如值传入,就将数据处理成数组并通过&(“#aa”).val(arr).trigger