这两天做项目需要用到多选控件,于是选择了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. OC键值观察KVO

    什么是KVO? 什么是KVO?KVO是Key-Value Observing的简称,翻译成中文就是键值观察.这是iOS支持的一种机制,用来做什么呢?我们在开发应用时经常需要进行通信,比如一个model ...

  2. strlen与sizeof的区别 [转]

    转自:http://www.cppblog.com/liangbo/archive/2006/10/06/13394.html 1.sizeof操作符的结果类型是size_t,它在头文件中typede ...

  3. 对于C语言中数组名是指针的理解

    我们都知道,c语言中数组名是一个指针,比如下面这段代码 #include<iostream>using namespace std;int main(){ int a[4]={1,2,3, ...

  4. thinkphp 3+ 观后详解 (1)

    最近面试了一些公司,发现自己的对于架构能力的不足,于是决定开始从最基本的代码做起.先看看大牛们怎么架构整个框架的.鉴于国外的框架比较难懂,于是就选择了国内比较流行的thinkphp来进行研究. 下面写 ...

  5. PPT美化大师

    PPT美化大师 http://docer.mysoeasy.com/ PPT文档美化大师是一款专门为Office文档优化锦上添花的工具,该软件时尚个性打造出最漂亮的模板,有了这款软件在操作起来也简单许 ...

  6. PL/pgSQL学习笔记之六

    http://www.postgresql.org/docs/9.1/static/plpgsql-declarations.html 39.3.1. 声明函数参数 传递给函数的参数被用 $1.$2等 ...

  7. jquery禁用右键、文本选择功能、复制按键的实现

    同时适合IE.firefox.谷歌浏览器下适用,经过筛选代码如下 //禁用右键.文本选择功能.复制按键 $(document).bind(“contextmenu”,function(){return ...

  8. Ajax获得站点文件内容实例

    一个简单的Ajax实例:选择一部著作,会通过 Ajax 实时获得相关的名字. 把4个html文件放到 web站点 的同一个文件下. index.html <html> <head&g ...

  9. 【JavaScript】理解与使用Javascript中的回调函数

    在Javascript中,函数是第一类对象,这意味着函数可以像对象一样按照第一类管理被使用.既然函数实际上是对象:它们能被“存储”在变量中,能作为函数参数被传递,能在函数中被创建,能从函数中返回. 因 ...

  10. oc-25- @property @synthesize

    s.h #import <Foundation/Foundation.h> @interface Student : NSObject { @public NSString *_name; ...