easyUI datagrid中checkbox选中事件以及行点击事件,翻页之后还可以选中
DataGrid其中与选择,勾选相关
DataGrid属性:
singleSelect boolean 如果为true,则只允许选择一行。 false
ctrlSelect boolean 在启用多行选择的时候允许使用Ctrl键+鼠标点击的方式进行多选操作。(该属性自1.3.6版开始可用)
checkOnSelect boolean 如果为true,当用户点击行的时候该复选框就会被选中或取消选中。如果为false,当用户仅在点击该复选框的时候才会呗选中或取消。(该属性自1.3版开始可用) true
selectOnCheck boolean 如果为true,单击复选框将永远选择行。如果为false,选择行将不选中复选框。(该属性自1.3版开始可用)
DataGrid列是一个数组对象,该元素也是一个数组对象。元素数组里面的元素是一个配置对象,它用来定义每一个列字段。
checkbox boolean 如果为true,则显示复选框。该复选框列固定宽度。
DataGrid事件
onClickRow rowIndex, rowData 在用户选择一行的时候触发,参数包括:rowIndex:选择的行的索引值,索引从0开始。rowData:对应于所选行的记录。
onLoadSuccess
onSelect rowIndex, rowData 在用户选择一行的时候触发,参数包括:rowIndex:选择的行的索引值,索引从0开始。rowData:对应于所选行的记录。
onUnselect rowIndex, rowData 在用户取消选择一行的时候触发,参数包括:rowIndex:选择的行的索引值,索引从0开始。rowData:对应于取消选择行的记录。
onSelectAll rows 在用户选择所有行的时候触发。
onUnselectAll rows 在用户取消选择所有行的时候触发。
onCheck rowIndex,rowData 在用户勾选一行的时候触发,参数包括:rowIndex:选中的行索引,索引从0开始。rowData:对应于所选行的记录。(该事件自1.3版开始可用)
onUncheck rowIndex,rowData 在用户取消勾选一行的时候触发,参数包括:rowIndex:选中的行索引,索引从0开始。rowData:对应于取消勾选行的记录。(该事件自1.3版开始可用)
onCheckAll rows 在用户勾选所有行的时候触发。(该事件自1.3版开始可用)
onUncheckAll rows 在用户取消勾选所有行的时候触发。(该事件自1.3版开始可用)
方法
getChecked none 在复选框呗选中的时候返回所有行。(该方法自1.3版开始可用)
getSelected none 返回第一个被选中的行或如果没有选中的行则返回null。
getSelections none 返回所有被选中的行,当没有记录被选中的时候将返回一个空数组。
clearSelections none 清除所有选择的行。
clearChecked none 清除所有勾选的行。(该方法自1.3.2版开始可用)
selectAll none 选择当前页中所有的行。
unselectAll none 取消选择所有当前页中所有的行。
selectRow index 选择一行,行索引从0开始。
selectRecord idValue 通过ID值参数选择一行。
unselectRow index 取消选择一行。
checkAll none 勾选当前页中的所有行。(该方法自1.3版开始可用)
uncheckAll none 取消勾选当前页中的所有行。(该方法自1.3版开始可用)
checkRow index 勾选一行,行索引从0开始。(该方法自1.3版开始可用)
uncheckRow index 取消勾选一行,行索引从0开始。(该方法自1.3版开始可用)
例子:
$("#qoAccountBalanceList").datagrid({
onSelect:function(index, row){
var checedMoneySum=0;
ids=[];
var rowsData = $('#qoAccountBalanceList').datagrid('getSelections');
$(rowsData).each(function(index, data){
ids.push(data.Id);
if (rowsData[index].receiptPlanMoney==''){
checedMoneySum=checedMoneySum+parseFloat(rowsData[index].paySum);
} else {
checedMoneySum=checedMoneySum+parseFloat(rowsData[index].receiptPlanMoney);
}
});
$("input[name='checkedMoney']").val(checedMoneySum);
},
onUnselect:function(index, row){
var checedMoneySum=0;
ids=[];
var rowsData = $('#qoAccountBalanceList').datagrid('getSelections');
$(rowsData).each(function(index, data){
ids.push(data.Id);
if (rowsData[index].receiptPlanMoney==''){
checedMoneySum=checedMoneySum+parseFloat(rowsData[index].paySum);
} else {
checedMoneySum=checedMoneySum+parseFloat(rowsData[index].receiptPlanMoney);
}
});
$("input[name='checkedMoney']").val(checedMoneySum);
},
onSelectAll:function(index, row){
var checedMoneySum=0;
ids=[];
var rowsData = $('#qoAccountBalanceList').datagrid('getSelections');
$(rowsData).each(function(index, data){
ids.push(data.Id);
if (rowsData[index].receiptPlanMoney==''){
checedMoneySum=checedMoneySum+parseFloat(rowsData[index].paySum);
} else {
checedMoneySum=checedMoneySum+parseFloat(rowsData[index].receiptPlanMoney);
}
});
$("input[name='checkedMoney']").val(checedMoneySum);
},
onUnselectAll:function(index, row){
var checedMoneySum=0;
ids=[];
var rowsData = $('#qoAccountBalanceList').datagrid('getSelections');
$(rowsData).each(function(index, data){
ids.push(data.Id);
if (rowsData[index].receiptPlanMoney==''){
checedMoneySum=checedMoneySum+parseFloat(rowsData[index].paySum);
} else {
checedMoneySum=checedMoneySum+parseFloat(rowsData[index].receiptPlanMoney);
}
});
$("input[name='checkedMoney']").val(checedMoneySum);
},
onLoadSuccess:function(){
for (var i = 0; i < ids.length; i++) {
$('#qoAccountBalanceList').datagrid('selectRecord', ids[i]);//翻页之后还可以选中
}
}
easyUI datagrid中checkbox选中事件以及行点击事件,翻页之后还可以选中的更多相关文章
- antd-vue中给table表格整行加点击事件
<a-table :columns="columns" :dataSource="data" :loading="loading" : ...
- easyUI datagrid中 checkbox 各属性和事件
DataGrid其中与选择,勾选相关 DataGrid属性:singleSelect boolean 如果为true,则只允许选择一行. false ctrlSelect boolean 在启用多行 ...
- easyui datagrid中 多表头方法总结
easyui datagrid中怎么设置表头成多行显示呢?其实很简单,就是给datagrid的columns属性设置成多个数组就行了.下面直接看例子吧,这是一个两行表头的,按照此方法,还可以设置三行表 ...
- JQuery easyUi datagrid 中 自定义editor作为列表操作按钮列
转自 http://blog.csdn.net/tianlincao/article/details/7494467 前言 JQuery easyUi datagrid 中 使用datagrid生 ...
- easyui datagrid 中序列化后的日期格式化
1.在easyui datagrid 中序列化后的日期显示为:/Date(1433377800000)/ 2.格式化后的显示为: 2015-06-04 08:30:00 3.使用代码如下: 3.1. ...
- 在Activity中响应ListView内部按钮的点击事件
最近交流群里面有人问到一个问题:如何在Activity中响应ListView内部按钮的点击事件,不要在Adapter中响应? 对于这个问题,我最初给他的解答是,在Adapter中定义一个回调接口,在A ...
- 在Activity中响应ListView内部按钮的点击事件的两种方法!!!
在Activity中响应ListView内部按钮的点击事件的两种方法 转载:http://www.cnblogs.com/ivan-xu/p/4124967.html 最近交流群里面有人问到一个问题: ...
- 在Activity中响应ListView内部按钮的点击事件的两种方法
转载:http://www.cnblogs.com/ivan-xu/p/4124967.html 最近交流群里面有人问到一个问题:如何在Activity中响应ListView内部按钮的点击事件,不要在 ...
- asp.net gridview 如何实现行点击事件
第一步:绑定行点击事件 protected void GV_DATA_RowDataBound( object sender, GridViewRowEventArgs e ) { if( e.Row ...
随机推荐
- Web项目测试流程总结
个人知识脑图总结 - 未完全(工作项目脑图总结存于网盘中)
- linux 下用find命令查找文件,rm命令删除文件
linux 下用find命令查找文件,rm命令删除文件. 删除指定目录下指定文件find 要查找的目录名 -name .svn |xargs rm -rf 删除指定名称的文件或文件夹: find -t ...
- MySQL中导入Excel表格中的数据
在数据库中建立好响应的数据库.表(参考excel表格中列中的名字和内容): 将excel表格另存为txt文件,选择“文本文件(制表符分割)”: 打开相应的txt文件,只留下要导入的数据(windows ...
- 03docker镜像
docker的镜像操作 Union文件系统是Docker镜像的基础. UnionFS(联合文件系统):Union文件系统是一种分层,轻量级并且高性能的文件系统.它支持对文件系统的修改作为一次提交来一层 ...
- HashMap—— values() remove方法 containsKey()方法 containsValue()方法
values()方法:看下面的实例,就是把所有的value值封装成一个connection型的数组 Map<Integer,Student> students=new HashMap< ...
- B2C电商平台开发心得(asp.net+bootstrap)
Bootstrap,来自 Twitter,是目前最受欢迎的前端框架.Bootstrap 是基于 html.css.javascript的,专为 web 应用设计,包含了移动设备优先的样式, 其响应式 ...
- C#实现鼠标滚筒缩放界面的效果
elementCanvas继承UserControl 声明属性: #region 缩放属性添加 float ratio = 1.0f; public float Ratio { set { ratio ...
- nested exception is org.apache.ibatis.binding.BindingException
mybatis出错 xml文件: <update id="decreaseStock"> update item_stock set stock = stock - # ...
- 对MySQL索引、锁及事务的简单分析
一.索引的数据结构 1.二叉搜索树实现的索引 二叉搜索树如下图,它查找元素的时间复杂度为O(logn) 但如果经常出现增删操作,最后导致二叉搜索树变成线性的二叉树,这样它查找元素的时间复杂度就会变成O ...
- GitLab 部署及管理员账号初始化
Linux系统搭建GitLab---阿里云Centos7搭建Gitlab踩坑一.简介GitLab,是一个利用 Ruby on Rails 开发的开源应用程序,实现一个自托管的Git项目仓库,可通过We ...