easyui combo下拉框多选框
按照自己的方式,先晒下效果图:

选一个值,那么就在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下拉框多选框的更多相关文章
- 关于easyui combobox下拉框实现多选框的实现
好长时间没有更博了,一是因为最近真的比较忙,二是因为自己是真的偷懒了,哈哈 好啦,这篇博客主要是总结一些关于easyui combobox下拉框实现多选框的实现,包括前台界面的展示,和后台对数据的获取 ...
- easyui combobox下拉框复制后再禁用,点击不会出现下拉框
easyui combobox下拉框禁用,点击不会出现下拉框 需要做到,在给easyui combobox赋值后,再禁用easyui combobox 解决办法: $("#time-sele ...
- 雷林鹏分享:jQuery EasyUI 树形菜单 - 创建带复选框的树形菜单
jQuery EasyUI 树形菜单 - 创建带复选框的树形菜单 easyui 的树(Tree)插件允许您创建一个复选框树.如果您点击一个节点的复选框,这个点击的节点信息将向上和向下继承.例如:点击 ...
- easyui combogrid下拉表格的分页/按键/动态搜索
作者:xfl4629712 < easyui combogrid下拉表格的分页/按键/动态搜索 > 需求: 1.下拉框下拉时出现表格: 2.表格带分页功能: 3.可以使用向上键.向下 ...
- 关于通过jq /js 实现验证单选框 复选框是否都有被选中
今天项目中遇到一个问题 就是要实现,单选框,复选框 同时都被选中才能进行下一步的问题,开始用js原生来写 怎么写都觉得不合适,通过for循环得出 复选框被选中的,在通过for循环得出单选框被选中的,问 ...
- JS 获取select(多选下拉)中所选值的示例代码
通过js获取select(多选下拉)中所选值,具体实现如下,有需要的朋友可以参考下,希望对大家有所帮助 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML ...
- AngularJS进阶(五)Angular实现下拉菜单多选
Angular实现下拉菜单多选 写这篇文章时,引用文章地址如下: http://ngmodules.org/modules/angularjs-dropdown-multiselect http:// ...
- layui扩展组件,下拉树多选
项目介绍 项目中需要用到下拉树多选功能,找到两个相关组件moretop-layui-select-ext和wujiawei0926-treeselect,但是moretop-layui-selec ...
- easyui combotree下拉框多选赋值
发现jquery.easyui.min.js 1.3.4版本的用setValues给多选下拉框赋值不成功,只能用1.3.1版本的 Html代码: <input id="ProductL ...
随机推荐
- OC-设计模式KVC+KVO定义及使用
一.KVC Key-Value-Coding 键值编码(KVC:是一种存取值的方式,通过key存value 或者通过key获取value key从哪里来的呢? key 把对象里面的属性名.变量名当作了 ...
- erlang接入远程shell
两种方式 erl -name aaa@127.0.0.1 -setcookie erl -name bbb@127.0.0.1 -setcookie ctrl + g进入jcl模式 h查看帮助 r ' ...
- rdynamic和-whole-archive
遇到如下情况,主程序通过dlopen来打开.so文件,但是.so用到了主程序的log函数. 编译so时,通过引用主程序头文件来编译通过,头文件有log函数声明: extern "C" ...
- Perl system(cmd) 和 `cmd` 的区别探讨
在perl中系统调用有两种方式,一种是system(cmd),另一种是`system`以前一直没注意,这两种方式的区别,还以为是一样的,今天写脚本的时候,忽然想要获取命令的返回值,然后,用了my $r ...
- oracle学习笔记(一)配置监听
服务器端: 监听器 lsnrctl 启动监听 lsnrctl start [LISTENER] 查看监听 lsnrctl status 或者 lsnrctl service C:\Docu ...
- Redis数据库?-Redis的Virtual Memory介绍(转)
众所周知,Redis是一个内存数据库,和Memcached类似,所有数据存在内存中,当然,Redis有rdb和appendonlyfile两个落地文件,可以对断电停机等故障下的数据恢复做一些保证.但是 ...
- codeforces 439 E. Devu and Birthday Celebration 组合数学 容斥定理
题意: q个询问,每一个询问给出2个数sum,n 1 <= q <= 10^5, 1 <= n <= sum <= 10^5 对于每一个询问,求满足下列条件的数组的方案数 ...
- 转-ListView的性能优化之convertView和viewHolder
ListView的性能优化之convertView和viewHolder 2014-05-14 参考:http://www.cnblogs.com/xiaowenji/archive/2010/12/ ...
- ylbtech-Unitity-CS-Arrays:数组
ylbtech-Unitity-CS-Arrays:数组 1.A,效果图返回顶部 1.B,源代码返回顶部 1.B.1, using System; class DeclareArraysSampl ...
- 怎么安装phpcms?PHPCMS V9安装图文教程
Phpcms是国内领先的网站内容管理系统, 同时也是一个开源的PHP开发框架.PHPCMS V9目前已提供文章.图片.下载等内容模型,在此基础上可非常方便的扩展出信息.房产.交友.点评等功能.已有的模 ...