看了http://www.cnblogs.com/yubinfeng/p/4463418.html这篇博客,我添加了部分代码,以便在最后获取combobox的value时可以拿到一个数组。

HTML代码:

<input id="com" class="easyui-combobox"/>
<input type="button" value="按钮" id="btn"/>

此处代码来自http://www.cnblogs.com/yubinfeng/p/4463418.html

$("#com").combobox({
valueField : 'id',
textField : 'name',
url:'combobox.json',
panelMaxHeight: 300,
multiple: true,
formatter: function(row){
var opts = $(this).combobox('options');
return '<input type="checkbox" class="combobox-checkbox">' + row[opts.textField]
},
onShowPanel: function () {
var opts = $(this).combobox('options');
var target = this;
var values = $(target).combobox('getValues');
$.map(values, function (value) {
var el = opts.finder.getEl(target, value);
el.find('input.combobox-checkbox')._propAttr('checked', true);
})
},
onLoadSuccess: function () {
var opts = $(this).combobox('options');
var target = this;
var values = $(target).combobox('getValues');
$.map(values, function (value) {
var el = opts.finder.getEl(target, value);
el.find('input.combobox-checkbox')._propAttr('checked', true);
})
},
onSelect: function (row) {
console.log(row);
var opts = $(this).combobox('options');
var el = opts.finder.getEl(this, row[opts.valueField]);
el.find('input.combobox-checkbox')._propAttr('checked', true);
},
onUnselect: function (row) {
console.log(row);
var opts = $(this).combobox('options');
var el = opts.finder.getEl(this, row[opts.valueField]);
el.find('input.combobox-checkbox')._propAttr('checked', false);
} })

点击按钮,获取combobox的value时发现只能获取到下拉列表中的第一项value

添加以下代码即可获取所有value的数组集合。

$("#btn").click(function(){
var opts = $("#com").combobox("panel").find(".combobox-item.combobox-item-selected");
var rows = $("#com").combobox("getData"),value = [];
$.each(opts,function(i,v){
value.push(rows[$(v).index()].id);
})
console.log(value);
})

combobox里面显示checkbox的更多相关文章

  1. WinForm控件TreeView 只部分节点显示 CheckBox

    WinForm控件TreeView 只部分节点显示  CheckBox 用过asp.net的应该知道,要在treeview中实现上述功能可以使用ShowCheckBox 属性指定那些节点显示check ...

  2. TreeView 自定义显示checkbox

    本项目需要对TreeView进行定制,要求比较简单,主要要求如下: Winform中TreeView控件默认只支持所有级别的CheckBox显示或者不显示,不能控制制定Level的树节点显示 效果如下 ...

  3. Android 长按Listview显示CheckBox,实现批量删除。

    ListView实现的列表,如果是可编辑,可删除的,一般都要提供批量删除功能,否则的话,一项一项的删除体验很不好,也给用户带来了很大的麻烦. 实现效果图 具体实现代码 select.xml 主布局文件 ...

  4. extjs中combobox默认显示第一个值

    在进入页面时往往用户希望页面能够显示默认的内容,但是页面中会存在一些选项通过用户选择之后才会加载相应的内容.在这篇文章里面介绍了如何去设置页面中默认的内容,如combobox默认显示第一个值. 页面: ...

  5. combobox无法显示选中的数据,都是undefined

    $('#firstfactor').combobox({                url: '@Url.Action("GetMultiAirFactor_Day_New", ...

  6. C# TreeView 自定义显示checkbox

    本项目需要对TreeView进行定制,要求比较简单,主要要求如下: Winform中TreeView控件默认只支持所有级别的CheckBox显示或者不显示,不能控制制定Level的树节点显示 效果如下 ...

  7. cxGrid增加一栏显示checkBox的设置方法

    鉴于本人首次设定cxGrid的CheckBox的时候费了很大劲,发现很多人都会碰到这个问题,现在总结一下,以供各位互相学习借鉴. 步骤如下(不分先后): 1. cxGrid添加完自己所需的所有字段后, ...

  8. Ajaxtoolkit Combobox位置显示不对解决

    当父级容器设置positon是absolute或relative,combobox显示的就会出现偏移,解决办法如下: 添加这个样式 .ajax__combobox_itemlist{    posit ...

  9. easyui combobox 中实现 checkbox

    $('#cc').combobox({ url:'combobox_data1.json', method:'get', valueField:'id', textField:'text', pane ...

随机推荐

  1. git 设置 .gitignore 为全局global + 配置.gitignore为全局后不生效解决办法

    outline 什么是 .gitignore 以及 .gitignore 的作用,这里不做赘述,自行网上查阅. 设置 .gitignore 为全局生效 懒得自己逐行敲忽略规则的话,建议移步:https ...

  2. Django - 文件上传、Django组件 - 分页器(paginator)

    一.文件上传准备知识 - Content-Type 1.请求头 - Content-Type Content-Type指的是请求体的编码类型,常见的类型共有3种: 1)application/x-ww ...

  3. MySQL具体解释(20)-----------数据库备份和还原

    数据备份: 使用mysqldump命令备份 mysqldump命令能够讲数据库中的数据备份成一个文本文件. 表结果和表中的数据将存储在生成的文本中.mysqldump的工作原理非常easy. 他先查出 ...

  4. (转)JAVA-反射机制的使用

    Java反射机制的实现原理 反射机制:所谓的反射机制就是java语言在运行时拥有一项自观的能力.通过这种能力可以彻底的了解自身的情况为下一步的动作做准备.下面具体介绍一下java的反射机制.这里你将颠 ...

  5. 005-jdk安装卸载

    一.yum安装 1.查看CentOS自带JDK是否已安装. yum list installed |grep java 2.若有自带安装的JDK,卸载CentOS系统自带Java环境 卸载JDK相关文 ...

  6. pandas(八)重塑和轴向旋转

    重塑层次化索引 层次化索引为DataFrame的重排提供了良好的一致性操作,主要方法有 stack :将数据的列旋转为行 unstack:将数据的行转换为列 用一个dataframe对象举例 In [ ...

  7. Delphi 正则表达式语法(6): 贪婪匹配与非贪婪匹配

    Delphi 正则表达式语法(6): 贪婪匹配与非贪婪匹配 //贪婪匹配 var   reg: TPerlRegEx; begin   reg := TPerlRegEx.Create(nil);   ...

  8. jsp页面向后台传递 不赋值 传递的默认值

    <input type="hidden" name="leaderIdentity" value="${subject.leaderId }&q ...

  9. IO 复习笔记

    输入流,从源到流中:输出流,从流到目的地. 1. 操作文件:     1).写入:FileOutputStream或者FileWriter     2).读取:FileInputStream或者Fil ...

  10. jar包错误

    Exception in thread "main" java.lang.NoSuchMethodError: org.slf4j.spi.LocationAwareLogger. ...