chosen.jquery.js 使用笔记
using chosen.jquery.js
using chosen.jquery.css
html:
<label for="MeetingUsersList" class="label"><strong class="fg-red">∗</strong> 参会人员</label>
<select data-placeholder="请选择参会人员..." id="MeetingUsersList" multiple="multiple" class="chosen-select form-control"></select>
<input type="hidden" id="MeetingUsers" placeholder="参会人员" name="MeetingUsers">
<input type="hidden" id="MeetingUsersName" placeholder="参会人员" name="MeetingUsersName">
<div class="field-validation-error" data-valmsg-for="MeetingUsersList" validata="MeetingUsers"></div>
j s:
$.ajax({
type: "post",
url: "/UserMeeting/MeetingUserList",//初始化下拉多选列表
global: false,
success: function (data) {
$('#MeetingUsersList').html(data);//绑定下拉值
//初始化
var chose = $("#MeetingUsersList").chosen({
no_results_text: "Sorry,未检索到相关数据!",
max_selected_options: 100,
width: "100%"
});
var aa = 1;
chose.trigger("liszt:updated");
chose.change(function (e, t) {
var selectedTitle = '';
var selected = '';
$("div[validata='MeetingUsers']").css('display', 'none');
selected = $("#MeetingUsersList").val();
$.each($(".chosen-container .search-choice"), function (i, e) {
selectedTitle += $(e).find('span').text() + ',';
});
$("#MeetingUsers").val(selected);//保存选择值
$("#MeetingUsersName").val(selectedTitle.substring(0, selectedTitle.length - 1));//保存选择标题
chose.trigger('chosen:updated');
}).bind("chosen:maxselected", function () {
$("div[validata='MeetingUsers']").css('display', 'block').html('请选择参会人员!');
return false;
});
//初始化设置值
chose.val($("#MeetingUsers").val().split(','));//根据value设置选中值,设置的时候如果多个 传数组
chose.trigger('chosen:updated');//传递完成之后刷新
}
});
chosen.jquery.js 使用笔记的更多相关文章
- chosen.jquery.js 搜索框只能从头匹配的解决思路+方法
chosen.jquery.js 搜索框只能从头匹配的解决思路+方法 心急者请直接看下方 总结 ,由于本问题未能找到直接答案,所以只能通过修改源码解决.故将修改源码思路贴出来供大家参考,在遇到其他改源 ...
- chosen.jquery.js
http://baifjece.blog.163.com/blog/static/33794654201286102519119/ ------------------首次加载设置默认选中项----- ...
- 基于jquery的插件turn.js学习笔记
基于jquery的插件turn.js学习笔记 简介 turn.js是一个可以实现3d书籍展示效果的jq插件,使用html5和css3来执行效果.可以很好的适应于ios和安卓等触摸设备. How it ...
- chosen.jquery.min.js select2.js 弊端
chosen.jquery.min.js --将select放在页面最下方,会导致页面高度增加,最下方空白多出来 select2.js --点击select 但未选择,然后移出鼠标,发现其他文本框.关 ...
- React.js入门笔记
# React.js入门笔记 核心提示 这是本人学习react.js的第一篇入门笔记,估计也会是该系列涵盖内容最多的笔记,主要内容来自英文官方文档的快速上手部分和阮一峰博客教程.当然,还有我自己尝试的 ...
- jquery mobile开发笔记之Ajax提交数据(转)
http://my.oschina.net/xiahuawuyu/blog/81763 这两天学习了下,jquery mobile(以下简称jqm)的开发相关的内容.可能之前有过web的开发基础,相对 ...
- 带搜索框的下拉框chosen.jQury.js
下载所需js,css png资源 <link href="chosen.css" rel="stylesheet" type="text ...
- 【转】Backbone.js学习笔记(二)细说MVC
文章转自: http://segmentfault.com/a/1190000002666658 对于初学backbone.js的同学可以先参考我这篇文章:Backbone.js学习笔记(一) Bac ...
- Node.js学习笔记(3):NPM简明教程
Node.js学习笔记(3):NPM简明教程 NPM常用操作 更新NPM版本 npm install npm -g -g,表示全局安装.我们可以指定更新版本,只需要在后面填上@版本号即可,也可以输入@ ...
随机推荐
- 2017-12-04HTML table布局
<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...
- Android基础TOP5_2:MultiAutoCompleteTextView多文本自动补全文本框
Activity: <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmln ...
- 什么是vuejs之重新认识vuejs
什么是vuejs? 1.它是一个轻量级的mvvm框架 2.数据驱动+组件化的前端开发 3.github超过25k+的stat数,社区完善 4.vuejs更轻量,gzip后大小只有20k+ 5.vuej ...
- 北大ACM(POJ1020-Anniversary Cake)
Question:http://poj.org/problem?id=1020 问题点:DFS. Memory: 260K Time: 47MS Language: C++ Result: Accep ...
- C/c++中 数组全局变量的定义声明 与 引用声明
数组声明一次,所有的 定义声明 有切仅有一次! 别人遇到的问题如下: 在声明定义时,定义数组如下: int G_glob[100]; 在其他文件引用时声明如下: int *G_glob; 这样的操 ...
- Flask框架 之request对象
一.request对象属性 属性 说明 类型 data 记录请求的数据,并转换为字符串 * form 记录请求中的表单数据 MultiDict args 记录请求中的查询参数 MultiDict co ...
- 基于APE物理引擎的管线容积率计算方法
容积率一般应用在房地产开发中,是指用地范围内地上总建筑面积与项目总用地面积的比值,这个参数是衡量建设用地使用强度的一项非常重要的指标.在其他行业,容积率的计算也非常重要,如产品利用率.管道使用率等等. ...
- The method buildSessionFactory() from the type Configuration is deprecated.SessionFactory的变化
在创建Configuration对象之后:Configuration cfg = new Configuration().configure(); 要通过Configuration创建SessionF ...
- Java基本数据类型、包装类与String类之间的转换
一.基本数据类型与包装类之间的转换: import org.junit.Test; public class MainTest { /** * 基本数据类型与包装类之间的转换 */ @Test pub ...
- 洛谷——P2007 魔方
P2007 魔方 常神牛家的魔方都是3*3*3的三阶魔方,大家都见过. 模拟即可: #include<iostream> #include<cstdio> #include&l ...