按照自己的方式,先晒下效果图:

选一个值,那么就在input里面显示一个,去掉勾选,那么input就会少一个

其实做法很简单,今天就是快下班了,闲着没事加篇博客而已,下面带上代码。

1.页面的展示,input,其中prolist是从后台传过来的modl,从后台查到的数据,放到了request域中,前台进行接下值

<td>近期活动</td>
                    <td>
                                 <select id="activities" name="activities" data-options="editable:true,width:200" style="width:200px;height:30px"></select>
                              <div id="sp">
                                <c:forEach items="${prolist }" var="b">
                                    <input type="checkbox" name="activities" value="${b.id}">
                                    <span>${b.name}</span>
                                    <br />
                                </c:forEach>
                            </div>
                            
                           </td>
    

2.js代码展示,附上这些代码,简单的多选框就搞定了

$(function() {
$('#activities').combo({
required : true,
editable : true,
multiple : true
});
$('#sp').appendTo($('#activities').combo('panel')); $("#sp input")
.click(
function() {
var _value = "";
var _text = "";
$("[name=activities]:input:checked").each(function() { _value += $(this).val() + ","; _text += $(this).next("span").text() + ",";
});
//设置下拉选中值
$('#activities').combo('setValue', _value).combo(
'setText', _text);
});
});

保存到后台的是id,选了多个的话,就是把这些id进行了拼接,是不是很简单,代码就不一一介绍了,需要的话可以直接拷过去

easyui combo下拉框多选框的更多相关文章

  1. 关于easyui combobox下拉框实现多选框的实现

    好长时间没有更博了,一是因为最近真的比较忙,二是因为自己是真的偷懒了,哈哈 好啦,这篇博客主要是总结一些关于easyui combobox下拉框实现多选框的实现,包括前台界面的展示,和后台对数据的获取 ...

  2. easyui combobox下拉框复制后再禁用,点击不会出现下拉框

    easyui combobox下拉框禁用,点击不会出现下拉框 需要做到,在给easyui combobox赋值后,再禁用easyui combobox 解决办法: $("#time-sele ...

  3. 雷林鹏分享:jQuery EasyUI 树形菜单 - 创建带复选框的树形菜单

    jQuery EasyUI 树形菜单 - 创建带复选框的树形菜单 easyui 的树(Tree)插件允许您创建一个复选框树.如果您点击一个节点的复选框,这个点击的节点信息将向上和向下继承.例如:点击 ...

  4. easyui combogrid下拉表格的分页/按键/动态搜索

    作者:xfl4629712  <  easyui combogrid下拉表格的分页/按键/动态搜索  > 需求: 1.下拉框下拉时出现表格: 2.表格带分页功能: 3.可以使用向上键.向下 ...

  5. 关于通过jq /js 实现验证单选框 复选框是否都有被选中

    今天项目中遇到一个问题 就是要实现,单选框,复选框 同时都被选中才能进行下一步的问题,开始用js原生来写 怎么写都觉得不合适,通过for循环得出 复选框被选中的,在通过for循环得出单选框被选中的,问 ...

  6. JS 获取select(多选下拉)中所选值的示例代码

    通过js获取select(多选下拉)中所选值,具体实现如下,有需要的朋友可以参考下,希望对大家有所帮助 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML ...

  7. AngularJS进阶(五)Angular实现下拉菜单多选

    Angular实现下拉菜单多选 写这篇文章时,引用文章地址如下: http://ngmodules.org/modules/angularjs-dropdown-multiselect http:// ...

  8. layui扩展组件,下拉树多选

      项目介绍 项目中需要用到下拉树多选功能,找到两个相关组件moretop-layui-select-ext和wujiawei0926-treeselect,但是moretop-layui-selec ...

  9. easyui combotree下拉框多选赋值

    发现jquery.easyui.min.js 1.3.4版本的用setValues给多选下拉框赋值不成功,只能用1.3.1版本的 Html代码: <input id="ProductL ...

随机推荐

  1. 【shell】nmap工具的使用

    NMap,也就是Network Mapper,是Linux下的网络扫描和嗅探工 具包,其基本功能有三个,一是探测一组主机是否在线:其次是扫描主机端口,嗅探所提供的网络服务:还可以推断主机所用的操作系统 ...

  2. IntelliJ IDEA通过Spring配置连接MySQL数据库

    先从菜单View→Tool Windows→Database打开数据库工具窗口,如下图所示: 点击Database工具窗口左上角添加按钮"+",选择Import from sour ...

  3. bzoj1382: [Baltic2001]Mars Maps

    Description 给出N个矩形,N<=10000.其坐标不超过10^9.求其面积并 Input 先给出一个数字N,代表有N个矩形. 接下来N行,每行四个数,代表矩形的坐标. Output ...

  4. Func系列3:自定义模块

    简介 Func自带的模块已经非常丰富,但在日常系统运维当中,尤其是面对大规模的服务器集群.不同类别的业务平台,次是Func自带的模块或许已经不能满足我们的需求,所以有必要通过自定义模块来填补这块的不足 ...

  5. Python 通过print将数据保存到文件中

    1. Print them to screen man = [] other = [] try: data = open('sketch.txt') for each_line in data: tr ...

  6. 黄聪:wordpress后台加载ajax.googleapis.com导致打开速度很慢的解决方案

    打开wordpress后台,发现很卡,通过开发者工具看到是因为加载http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/themes/smoothn ...

  7. ScalaTour-1.基础

    import java.io.{BufferedReader, File, FileInputStream, InputStreamReader} import java.util import ja ...

  8. C#继承的用法

    using System; namespace 继承 { public class cat { private string _name = null; private int _age = 0; p ...

  9. ADF_Starting系列1_JDeveloper IDE开发环境简介

    2013-05-01 Created By BaoXinjian

  10. IGS_学习笔记01_Integrated SOA Gateway介绍(案例)

    2014-01-01 Created By BaoXinjian