这两天做项目需要用到多选控件,于是选择了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. C#对HTML转译需要注意的问题

    在做B/S程序时我们多少会用到一点HTML特殊符号转译. 如:“&”——>“&” , "<"——>"<" , " ...

  2. Bit Twiddling Hacks

    http://graphics.stanford.edu/~seander/bithacks.html Bit Twiddling Hacks By Sean Eron Andersonseander ...

  3. li在IE中底部空行的BUG

    li在IE中底部空行的BUG 但是这次li在IE中底部出现的不是3像素而是一整条空白行,如图:HTML代码: <ul> <li><a href="#" ...

  4. 通过RDB还原用户误删除的邮件

    1.在任意一台邮箱服务器上新建RDB数据库目录:C:\rdb01 2.使用Windows Server Backup还原已备份的邮件数据(mbdb02)库到 C:\rdb01 目录下 3.创建RDB数 ...

  5. 【转】浅析linux内存模型

    转自:http://pengpeng.iteye.com/blog/875521 0. 内存基本知识 我们通常称 linux的内存子系统为:虚拟内存子系统(virtual memory system) ...

  6. 「译」JavaScript 的怪癖 1:隐式类型转换

    原文:JavaScript quirk 1: implicit conversion of values 译文:「译」JavaScript 的怪癖 1:隐式类型转换 译者:justjavac 零:提要 ...

  7. 试读《JavaScript语言精髓与编程实践》

    有幸看到iteye的活动,有幸读到<JavaScript语言精髓与编程实践_第2版>的试读版本,希望更有幸能完整的读到此书. 说来读这本书的冲动,来得很诡异,写一篇读后感,赢一本书,其实奖 ...

  8. Ajax 无刷新在注册用户名时的应用的代码

    var xmlHttp; uName() //用户名失去焦点时 { if(all.uname.=="") { all.l1.innerHTML="不能为空!"; ...

  9. Codeforces Round #335 (Div. 2) A. Magic Spheres 水题

    A. Magic Spheres Time Limit: 20 Sec Memory Limit: 256 MB 题目连接 http://www.codeforces.com/contest/606/ ...

  10. java学习笔记(5)——内部类

    一.内部类 1,静态内部类 使用static修饰,声明在类体中 静态内部类中可以访问外部类的静态成员 2,成员内部类 声明在类体中,不使用static,具有类的成员特征,也就是,必须有类的实例才能 创 ...