select2 多选 排序(版本3.4.6)
使用select2多选,页面选择值的顺序与传到control的值的顺序不一致,为了方便,没有改变本来js文件,在页面上面通过change方法改变。
1、页面代码(添加修改使用同一个页面)
<link rel="stylesheet" href="/js/select2/select2.css"/>
<script src="/js/jquery.min.js"></script>
<script src="/js/select2/select2.min.js" type="text/javascript"></script>
<script type="text/javascript">
var bData = [];
var bselect = $("#bIds").select2(bData);
$("#bIds").change(function(){
$(this).children('option:selected').each(function (index, domEle) {
var vv=$("#bookIds option[value='"+domEle.value+"']").val();
if (vv=='undefined' ) {
var option = $("<option>").val(domEle.value).attr("selected","true");
$("#bookIds").append(option);
}
});
$(this).children('option:not(:selected)').each(function (index, domEle) {
$("#bookIds option[value='"+domEle.value+"']").remove();
});
});
<#if action =='edit'>
var bmdata = [];
<#list entity.bookList as m>
bmdata.push({id:${m.id}, text: '${m.bookName}'});
$("#bookIds").append($("<option>").val(${m.id}).attr("selected","true"));
</#list>
bselect.select2("data", bmdata);
</#if>
</script>
<body>
<select id="bIds" multiple="multiple" class="select" >
<#list bookList as m>
<option value="${m.id}">${m.bookName}</option>
</#list>
</select>
<select id="bookIds" multiple="multiple" style="display: none;">
</select>
</body>
select2 多选 排序(版本3.4.6)的更多相关文章
- select2多选设置select多选,select2取值和赋值
select2设置select多选,select2取值和赋值,作为筛选条件的时候,取值相对简单,把选中的id值转为字符串传给后端查询,查询之后会刷新页面,为了在下拉框中显示刚刚选中的值,就需要给sel ...
- select2多选框初始化默认值和获得值
select2多选自带手动输入搜索功能,可怜我还查寻半天api 获得值: //chang函数获取选择的option $(".js-example").change(function ...
- laravel中select2多选,初始化默认选中项
项目中有发送消息功能,需要能通过搜索,多选用户,来指定发送人.使用 select2 插件来完成. select2 的 html 代码如下: <div class="form-group ...
- CheckBoxList 全选(jquery版本)
function selectedAll(allselect, obj) { $("#"+obj.id+" input:checkbox").each(func ...
- select2 多选设置默认值
Select2 version 4.0.3 https://select2.github.io <select id="slroles" ng-model=" ...
- select2多选
在TCX_1710项目中的拒绝代码配置页面可以选择多个拒绝字段,效果图如下 代码中需要注意的有以下地方:图1为提交保存时对多选数据的获取,图2为修改是对多选数据的回显 对于多选框宽度太窄的问题,可以参 ...
- 【学亮IT手记】angularJS+select2多选下拉框实例
永远保持对大部分知识的好奇心,学习从不枯燥,也没有被逼学习一说,乐此不疲才是该有的心态和境界!!! 引入相关js库: html部分代码: angularJS定义数据源变量:
- jQuery的下拉选select2插件用法
1转自:https://www.jb51.net/article/95561.htm 用了这么久的Select2插件,也该写篇文章总结总结.当初感觉Select2不是特别好用,但又找不到比它更好的下拉 ...
- 品优购商城项目(二)AngularJS、自动代码生成器、select2下拉多选框
品优购商城想项目第二阶段 AngularJS.自动代码生成器.select2下拉多选框 完成了课程第三天.第四天的的任务. 1.学习了AngularJs前端的mvc分层思想,js部分分成control ...
随机推荐
- 水库抽样Reservoir Sampling(蓄水池问题)
知识复习 空间亚线性算法:由于大数据算法中涉及到的数据是海量的,数据难以放入内存计算,所以一种常用的处理办法是不对全部数据进行计算,而只向内存里放入小部分数据,仅使用内存中的小部分数据,就可以得到 ...
- OFDM正交频分复用---基础入门图示
@(162 - 信号处理) 整理转载自:给小白图示讲解OFDM 下面以图示为主讲解OFDM,以"易懂"为第一要义. 注:下面的讨论如果不做说明,均假设为理想信道. *** 一张原理 ...
- Linux常用命令(二)————压缩+解压
tar -c: 建立压缩档案-x:解压-t:查看内容-r:向压缩归档文件末尾追加文件-u:更新原压缩包中的文件 这五个是独立的命令,压缩解压都要用到其中一个,可以和别的命令连用但只能用其中一个.下面的 ...
- 快速设置UITableView不同section对应于不同种类的cell
快速设置UITableView不同section对应于不同种类的cell 本文主要是为了写明如何在UITableView中,一个section对应于一种类型的cell,写起来不凌乱. 在不封装任何类的 ...
- oracle 大表 已有大数据量 建索引防卡 nologging
create index idx_th_user_info_fans_name on th_user_info(fans_name) nologging;
- Mybatis学习---基础知识考核
MyBatis 2.什么是MyBatis的接口绑定,有什么好处 接口映射就是在IBatis中任意定义接口,然后把接口里面的方法和SQL语句绑定, 我们直接调用接口方法就可以,这样比起原来了Sql ...
- Python 处理脚本的命令行参数-getopt
# -*- coding:utf-8 -*- import sys def test(): """ 参数列表:sys.argv 参数个数:len(sys.argv) 脚本 ...
- Linux命令--网络管理
write命令 Linux write命令用于传讯息给其他使用者. 使用权限:所有使用者. 语法 write user [ttyname] 参数说明: user : 预备传讯息的使用者帐号 ttyna ...
- 内网渗透中的mimikatz
0x00 前言 上篇测试了中间人攻击利用框架bettercap,这次挑选一款更具代表性的工具--mimikatz 0x01 简介 mimikatz,很多人称之为密码抓取神器,但在内网渗透中,远不止这么 ...
- 020.1.1 collections集合工具类
内容:常见需求以及使用—逆转比较器顺序,最值和同步方法 collections类的方法都是静态方法 强行逆转比较器的顺序例子: //##主函数.java List<String> list ...