这两天做项目需要用到多选控件,于是选择了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. redis的发布订阅模式

    概要 redis的每个server实例都维护着一个保存服务器状态的redisServer结构 struct redisServer {     /* Pubsub */     // 字典,键为频道, ...

  2. 转载:Erlang 资源

    Erlang资源 erlang豆瓣广播

  3. iepngfix.htc让PNG-24在IE6中透明的方法(转)

    add:360用的一个方法: <!--[if IE 6]> <script src="http://se.360.cn/js/DD_belatedPNG.js"& ...

  4. git filename to long问题解决

    在.git/config 下面编辑 [core] longpaths = true

  5. A debugger is already attached

    Today is the last day that all the laptops of winXP OS should be upgrade to WIN7. After updated. whe ...

  6. cocos2d-x (Android)之-那些常见的error记

    转自:http://blog.csdn.net/callchunli/article/details/8929813 (2013/9/2) build.xml:939: java.lang.Array ...

  7. EXchange2010配置

    DAG配置: 组织配置:如果见证服务器是DC不是exchange服务器,那么需要在AD用户和计算机里面,将exchange trusted subsystem 添加到 DC的本地管理员组(/built ...

  8. LVS测试小结

    RedHat5实现负载均衡 http://blog.sina.com.cn/s/blog_4e424e2101007rie.html http://www.doc88.com/p-9975618478 ...

  9. Robot Instructions

    http://uva.onlinejudge.org/index.php?option=com_onlinejudge&Itemid=8&page=show_problem&p ...

  10. Spark1.0.0 开发环境高速搭建

          在本系列博客中.为了解析一些概念.解析一些架构.代码測试.搭建了一个实验平台.例如以下图所看到的:       本实验平台是在一台物理机上搭建的.物理机的配置是16G内存,4核8线程CPU ...