关于easyUI的datagride的一些属性和事件
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 在复选框呗选中的时候返回所有行。
- getSelected none
返回第一个被选中的行或如果没有选中的行则返回null。 - getSelections none
返回所有被选中的行,当没有记录被选中的时候将返回一个空数组。 - clearSelections none 清除所有选择的行。
- clearChecked none 清除所有勾选的行。
- selectAll none 选择当前页中所有的行。
- unselectAll none 取消选择所有当前页中所有的行。
- selectRow index 选择一行,行索引从0开始。
- selectRecord idValue 通过ID值参数选择一行。
- unselectRow index 取消选择一行。
- checkAll none 勾选当前页中的所有行。
- uncheckAll none 取消勾选当前页中的所有行。
- checkRow index 勾选一行,行索引从0开始。
- uncheckRow index 取消勾选一行,行索引从0开始。
*例子:
$("#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]);//翻页之后还可以选中
}
}