easyui datalist按组多选
2024-08-27 17:18:56
结果如下:
数据样式如下:
[
{"text":"Epson WorkForce 845","group":"Printer"},
{"text":"Canon PIXMA MG5320","group":"Printer"},
{"text":"HP Deskjet 1000 Printer","group":"Printer"},
{"text":"Cisco RV110W-A-NA-K9","group":"Firewall"},
{"text":"ZyXEL ZyWALL USG50","group":"Firewall"},
{"text":"NETGEAR FVS318","group":"Firewall"},
{"text":"Logitech Keyboard K120","group":"Keyboard"},
{"text":"Microsoft Natural Ergonomic Keyboard 4000","group":"Keyboard"},
{"text":"Logitech Wireless Touch Keyboard K400","group":"Keyboard"},
{"text":"Logitech Gaming Keyboard G110","group":"Keyboard"},
{"text":"Nikon COOLPIX L26 16.1 MP","group":"Camera"},
{"text":"Canon PowerShot A1300","group":"Camera"},
{"text":"Canon PowerShot A2300","group":"Camera"}
]
代码如下:
<div class="easyui-datalist" title="Group DataList" id='list' style="width:400px;height:500px" data-options="
url: 'datalist_data1.json',
method: 'get',
groupField: 'group',
checkbox: true,
selectOnCheck: false,
onBeforeSelect: function(){return false;},
groupFormatter: groupFormatter
">
</div>
<script type="text/javascript"> function groupFormatter(fvalue, rows){ var first = $("#list").datalist('getRowIndex',rows[0]);
return "<input name='checkbox' type='checkbox' value='checkbox' onclick='checkall(this,"+ first +", " + rows.length + " )'/>" + fvalue + ' - <span style="color:red">' + rows.length + ' rows</span>';
} function checkall(node, first, length){ if(node.checked){
for(var i = 0; i < length; i++)
$("#list").datalist('checkRow',first+i);
}else{
for(var i = 0; i < length; i++)
$("#list").datalist('uncheckRow',first+i);
}
}
</script>
最新文章
- C# 类使用小demo
- Exploratory Undersampling for Class-Imbalance Learning
- static的用法
- glusterFS的常用命令 (转)
- 三级联动---DropDownList控件
- unity3d - new 不出的单例
- 如何设置缺省路由 route hosts(仅助记) 马连洼 马连洼 马连洼
- Qt Error: dependent &#39;..\***&#39; does not exist.
- Unity3D脚本18:可视化辅助设置类 Gizmos
- OpenGL 完全教程(写给Delphi的开发者) 前言
- pip是用国内镜像源
- MySQL事务机制
- FileZilla ftp服务器安装
- 2014年11月17号------html起始
- Myeclipse自动生成javabean的get和set方法
- 使用JS意识到自己主动提交表单
- Programming In Scala笔记-第十七章、Scala中的集合类型
- Python 3 函数自由变量的大坑
- windows系统命令行
- [20190213]测试服务端打开那些端口.txt