您的位置:首页 > Web前端 > JQuery

chosen.jquery.js 使用笔记

2016-09-28 09:26 197 查看
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');//传递完成之后刷新
}
});

  

内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: