JQuery multiselect的相关使用
这两天做项目需要用到多选控件,于是选择了JQuery multiselect控件,介绍一下常用的一些相关属性。
详细地址:http://davidstutz.github.io/bootstrap-multiselect
添加引用:

页面:
<div class="mui-input-row">
<span class="mui-icon mui-icon-contact mui-pull-right"></span>
<label style="color: #8f8f94;font-size: 15px !important">跟 踪 者</label>
<select id="example-getting-started" multiple="multiple">
@foreach (var emp in (List<SelectListItem>)ViewBag.unEmpList)
{
<option value="@emp.Value">@emp.Text</option>
}
</select>
</div>
JS:
$(document).ready(function () {
$('#example-getting-started').multiselect({
nonSelectedText: '请选择跟踪者', //默认
filterPlaceholder: '搜索', //搜索框内显示
nSelectedText: ' 位跟踪者',
enableFiltering: true,
includeSelectAllOption: true, //是否自耦的
selectAllText: '全选/全否',
allSelectedText: '已选中所有人员',
maxHeight: , //最大高度
dropUp: true, //控件是否朝上搜索
});
//取值 直接用 .val()就能取得多选中的值
var result = $('#example-getting-started').val();
// 设置默认值 注意格式
var ids = [, , , , ];
$('#example-getting-started').val(ids);
$('#example-getting-started').multiselect("refresh");
});
效果图:

JQuery multiselect的相关使用的更多相关文章
- js:jquery multiSelect 多选下拉框实例
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- jquery.multiselect 多选下拉框实现
第一步:链接下列文件,如果没有,到此网页下载 https://github.com/ehynds/jquery-ui-multiselect-widget,此插件基于jquery ,所以jquery的 ...
- jQuery multiselect的使用
1,下载插件 https://github.com/ehynds/jquery-ui-multiselect-widget
- [插件]jQuery multiselect初始化及默认值修改
下载地址:http://pan.baidu.com/s/1dE2daSD 1.Jquery多选下拉列表插件jquery multiselect功能介绍及使用 http://www.jb51.net/a ...
- jquery multi-select 实例demo
运行效果: 其他的不多说了,都是用的jquery.multiSelect.js组件实现的,直接看代码吧 代码下载地址: http://download.csdn.net/detail/ajavabir ...
- js进阶 13-6 jquery动画效果相关常用函数有哪些
js进阶 13-6 jquery动画效果相关常用函数有哪些 一.总结 一句话总结:animate(),stop(),finish(),delat()四个. 1.stop()方法的基本用法是什么(sto ...
- Jquery 多选下拉列表插件jquery multiselect
有一个多选的需求,在网上找到了这个插件:multiselect https://github.com/ehynds/jquery-ui-multiselect-widget csdn博客上有这个插件的 ...
- jQuery的select相关操作
例: <select class="selector" id="selector"></select> 1.设置value为pxx的项选 ...
- jquery multiselect使用示例
多选下拉框开源组件:https://github.com/ehynds/jquery-ui-multiselect-widget html部分: <select multiple id=&quo ...
随机推荐
- javascript js 内存泄露工具使用
javascript内存泄露工具使用 原文:http://lanhy2000.blog.163.com/blog/static/43678608201121472644851/ 2011-03-14 ...
- Gartner:Hype Cycle for Emerging Technologies-2013
The “Hype Cycle for Emerging Technologies” report is the longest-running annual Hype Cycle, provid ...
- mysql 清除数据库数据
select Concat('TRUNCATE TABLE ', TABLE_NAME, ';') from INFORMATION_SCHEMA.TABLES
- PL/pgSQL学习笔记之十
http://www.postgresql.org/docs/9.1/static/plpgsql-declarations.html 39.3.3. 类型拷贝 variable%TYPE %TYPE ...
- PL/pgSQL学习笔记之九
http://www.postgresql.org/docs/9.1/static/plpgsql-declarations.html 39.3.2. ALIAS newname ALIAS FOR ...
- ITEXT学习手册
本系列内容来自<iText in Action 2nd>,希望有时间的读者能够自己读一遍这本书 所有的文章相关的例子:IText.7z ITEXT基础 ITEXT学习手册——创建一个简单的 ...
- java学习路线(好资源大家分享)
对于入门java将近两年的时间,曾经迷惘过,一直想知道java的具体学习路线,看过了许许多多的java经验分享的帖子,评论,以及其他各种培训机构所谓的学习路线,发现没有一个符合我个人需求的学习路线,根 ...
- Java中this,static,super及finalkeyword和代码块
this: 能够使用this表示类中的属性------this.name=name 能够使用this强调调用的是本类的方法 能够使用this调用本类的构造方法------this();调用本类中无參构 ...
- 文件写入文件分布式系统(asp.net C#)
) { try { System.Drawing.Image img = System.Drawing.Image.FromStream(fileData.InputStream); &&am ...
- fir.im Weekly - 2016 移动开发技术大回顾
2016 年是移动技术发展迅速的一年,认认真真回顾这一年必不可少.@移动开发前线 的 这篇 2016移动开发技术巡礼 ,精心盘点了 2016 年 移动开发技术大事件,分为 iOS/Android平台篇 ...