这两天做项目需要用到多选控件,于是选择了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">跟&nbsp;踪&nbsp者</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的相关使用的更多相关文章

  1. js:jquery multiSelect 多选下拉框实例

    <!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  2. jquery.multiselect 多选下拉框实现

    第一步:链接下列文件,如果没有,到此网页下载 https://github.com/ehynds/jquery-ui-multiselect-widget,此插件基于jquery ,所以jquery的 ...

  3. jQuery multiselect的使用

    1,下载插件 https://github.com/ehynds/jquery-ui-multiselect-widget

  4. [插件]jQuery multiselect初始化及默认值修改

    下载地址:http://pan.baidu.com/s/1dE2daSD 1.Jquery多选下拉列表插件jquery multiselect功能介绍及使用 http://www.jb51.net/a ...

  5. jquery multi-select 实例demo

    运行效果: 其他的不多说了,都是用的jquery.multiSelect.js组件实现的,直接看代码吧 代码下载地址: http://download.csdn.net/detail/ajavabir ...

  6. js进阶 13-6 jquery动画效果相关常用函数有哪些

    js进阶 13-6 jquery动画效果相关常用函数有哪些 一.总结 一句话总结:animate(),stop(),finish(),delat()四个. 1.stop()方法的基本用法是什么(sto ...

  7. Jquery 多选下拉列表插件jquery multiselect

    有一个多选的需求,在网上找到了这个插件:multiselect https://github.com/ehynds/jquery-ui-multiselect-widget csdn博客上有这个插件的 ...

  8. jQuery的select相关操作

    例: <select class="selector" id="selector"></select> 1.设置value为pxx的项选 ...

  9. jquery multiselect使用示例

    多选下拉框开源组件:https://github.com/ehynds/jquery-ui-multiselect-widget html部分: <select multiple id=&quo ...

随机推荐

  1. 在Windows2012下安装SQL Server 2005无法启动服务的解决办法

    下面是我亲自经历过的总结. 因为尝鲜安装了Windows2012,的确很不错,唯一的遗憾就是不支持Sql Server 2005的安装.找了很多办法,基本上都有缺陷.现在终于找到一种完全正常没有缺陷的 ...

  2. Hibernate操作和保存方式

    Session API [Java Hibernate 之 CRUD 操作]http://www.codeceo.com/article/java-hibernate-crud.html   [Ses ...

  3. 动态链接库 仅有.dll文件时候的使用方法

    在没有.h和.lib文件时,需要函数指针和WIN32 API函数 LoadLibrary, GetProcAddress 和FreeLibrary 只需要.dll文件即可(将.dll文件置入工程目录中 ...

  4. ghostDoct 使用 (转 http://www.cnblogs.com/RockyMyx/archive/2010/04/20/Project-Route-Using-GhostDoc.html)

    一.简介 GhostDoc是Visual Studio的一个免费插件,可以为开发人员自动生成XML格式的注释文档. 二.下载 需要的朋友可以去这里下载,填个Email地址就可以下了:GhostDoc下 ...

  5. Mac下cocos2dx-3.0打包Android时,提示&quot;SimpleAudioEngine.h&quot;not found的解决方法

    前段时间触控公布cocos2dx-3.0,在升级之后试过之后,在最初的不习惯之后,感觉比之前的好用了不少,在下之前一直是用xCode模板创建,这回算是一口气升到顶了. 之后再一次编程时须要用到Sima ...

  6. iOS中CollectionView由于多次点击造成错误的解决方案

    iOS中CollectionCiew由于多次点击,会给程序造成错误. 这个时候,我们可以用过手势类来进行判断和过滤. 但是,有一个快捷的解决方法,那就是给用户响应增加延时操作. 具体代码如下: [co ...

  7. HDU 4757 Tree 可持久化字典树

    Tree Time Limit: 20 Sec Memory Limit: 256 MB 题目连接 http://acm.hdu.edu.cn/showproblem.php?pid=4757 Des ...

  8. cdoj 30 最短路 flyod

    最短路 Time Limit: 20 Sec  Memory Limit: 256 MB 题目连接 http://acm.uestc.edu.cn/#/problem/show/30 Descript ...

  9. codeforces Gym 100187L L. Ministry of Truth 水题

    L. Ministry of Truth Time Limit: 20 Sec Memory Limit: 256 MB 题目连接 http://codeforces.com/gym/100187/p ...

  10. 简短介绍 C# 6 的新特性 .net 6都要来了?

    几周前我在不同的地方读到了有关C#6的一些新特性.我就决定把它们都收集到一起,如果你还没有读过,就可以一次性把它们都过一遍.它们中的一些可能不会如预期那样神奇,但那也只是目前的更新. 你可以通过下载V ...