使用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)的更多相关文章

  1. select2多选设置select多选,select2取值和赋值

    select2设置select多选,select2取值和赋值,作为筛选条件的时候,取值相对简单,把选中的id值转为字符串传给后端查询,查询之后会刷新页面,为了在下拉框中显示刚刚选中的值,就需要给sel ...

  2. select2多选框初始化默认值和获得值

    select2多选自带手动输入搜索功能,可怜我还查寻半天api 获得值: //chang函数获取选择的option $(".js-example").change(function ...

  3. laravel中select2多选,初始化默认选中项

    项目中有发送消息功能,需要能通过搜索,多选用户,来指定发送人.使用 select2 插件来完成. select2 的 html 代码如下: <div class="form-group ...

  4. CheckBoxList 全选(jquery版本)

    function selectedAll(allselect, obj) { $("#"+obj.id+" input:checkbox").each(func ...

  5. select2 多选设置默认值

    Select2  version 4.0.3  https://select2.github.io   <select id="slroles" ng-model=" ...

  6. select2多选

    在TCX_1710项目中的拒绝代码配置页面可以选择多个拒绝字段,效果图如下 代码中需要注意的有以下地方:图1为提交保存时对多选数据的获取,图2为修改是对多选数据的回显 对于多选框宽度太窄的问题,可以参 ...

  7. 【学亮IT手记】angularJS+select2多选下拉框实例

     永远保持对大部分知识的好奇心,学习从不枯燥,也没有被逼学习一说,乐此不疲才是该有的心态和境界!!! 引入相关js库: html部分代码: angularJS定义数据源变量:

  8. jQuery的下拉选select2插件用法

    1转自:https://www.jb51.net/article/95561.htm 用了这么久的Select2插件,也该写篇文章总结总结.当初感觉Select2不是特别好用,但又找不到比它更好的下拉 ...

  9. 品优购商城项目(二)AngularJS、自动代码生成器、select2下拉多选框

    品优购商城想项目第二阶段 AngularJS.自动代码生成器.select2下拉多选框 完成了课程第三天.第四天的的任务. 1.学习了AngularJs前端的mvc分层思想,js部分分成control ...

随机推荐

  1. Grunt入门学习之(1) -- 环境安装

    Grunt入门学习(1) - 环境安装 这周根据项目需要,在项目的基础上分模块开发了一个小的项目板块,但是在规范组织每个模块的代码和其依赖性时比较麻烦,需要一个项目板块的构建工具.各个模块都包括其对应 ...

  2. 从golang-gin-realworld-example-app项目学写httpapi (四)

    https://github.com/gothinkster/golang-gin-realworld-example-app/blob/master/users/routers.go 路由定义 pa ...

  3. [翻译] SvpplyTable

    SvpplyTable https://github.com/liuminqian/SvpplyTable SvpplyTable is a demo to realize expandable an ...

  4. MySQL 数据库 -- 数据操作

    数据的增删改 一 介绍 MySQL数据操作: DML ======================================================== 在MySQL管理软件中,可以通过 ...

  5. .NET Reflector注册问题

    reflector工具不错, 终于8.x了,也可以注册了,但是不小心注册成standard版本了,但vs中无法使用,于是各种删注册表,后来找到何英涛的解决方案 下面介绍一个Reflector很坑的一个 ...

  6. 月报 提取/保存 到OneDrive. 并发送反馈邮件

  7. August 14th 2017 Week 33rd Monday

    Life is like a watch, you can return to the starting point, they are not yesterday! 人生就像钟表,可以回到起点,却已 ...

  8. except but

    He didn't speak anything but Greek... 他只会说希腊语.The crew of the ship gave them nothing but bread to ea ...

  9. Centos 安装 Oracle Java JDK

    Centos 安装 jdk 创建目录,用来存放下载的 JDK cd /usr/local mkdir -p tools cd tools 下载JDK,后边的下载地址你可以到 orcal 官网去获取最新 ...

  10. 本地缓存和redis

    项目中的传统架构在服务启动时 读取数据库的大部分数据到本地内存,在看到redis的作用时发出疑问,到底有什么样的区别以及怎么选择呢,下面是别人的回答 使用本地缓存快还是使用redis缓存好? Redi ...