首先是一点基础
datagrid对行的选择有两种方式:复选框和选择行
1,复选框是这样的:
EasyUI会提供表头的全选打钩功能,不用自己额外写代码
另外easyUI提供了一个配置,可以保留翻页之前打的钩,比如在第一页上勾选几行,然后翻页,当你再翻回第一页的时候,之前打的几个钩还在(按需使用,因为页面不会告诉你在其他页面是不是打过钩)
2,选择行是这样的:
图2
某一行选中的时候背景色会变成黄色(默认样式)
如果在datagrid里配置了singleSelect:true,则只能选择一行,相反singleSelect:false的话可以选择多行
复选框和选择行这两种方式可以联动
1,在datagrid里配置selectOnCheck : true,那么在打钩的时候,会把该行选中,点击全选复选框,那么所有行都会被选中
2,在datagrid里配置checkOnSelect : true,那么在选中某行的时候,会把该行的复选框打上钩
datagrid的idField属性
指示哪个字段是标识字段
这个字段必须设置为datagrid中存在的字段,并且这个字段要有值,否则在获取所有选中行的操作中(getChecked和getSelections)只会返回一行。
错误1,idField配置的字段不存在,就像下面的配置
$(‘#gogogo’).datagrid({
idField: ‘orderIdABC’,
columns: [ [
{field: ‘id’,title : ‘ID’,hidden : true,sortable : true},
{field: ‘orderId’,title : ‘运单号’,hidden : false,sortable : true},
{field: ‘count’,title : ‘件数’,hidden : false,sortable : true},
]],
});
idField配置为orderIdABC,但是columns里面并没有该字段,这种配置会影响获取行的操作。
错误2:idField配置的字段没有值,就像下面的配置
$(‘#gogogo’).datagrid({
idField: ‘orderId’,
columns: [ [
{field: ‘id’,title : ‘ID’,hidden : true,sortable : true},
{field: ‘orderId’,title : ‘运单号’,hidden : false,sortable : true},
{field: ‘count’,title : ‘件数’,hidden : false,sortable : true},
]],
});
datagrid获取的实际数据为[{“id”:”1″,”quantity”:”1″},{“id”:”2″,”quantity”:”1″}],即orderId字段无值
虽然表格可以正常显示(orderId字段显示为空),但是会影响获取行的操作。
下面是获得选择行的方式
getChecked
返回复选框选中的所有行。该方法自版本 1.3 起可用。
只判断复选框,不判断选择行
需要正确的idField,如果idField不对,只会返回一行
返回的是行组成的数组
比如:
var rows=$(‘#gogogo’).datagrid(‘getChecked’);
rows.length是行数
rows[0].id是第一行的id字段值
getSelected
返回第一个选中的行或者 null。
返回的是选择行方式选中的第一行,和复选框无关,并且只返回一行
返回的是行
比如:
var row=$(‘#gogogo’).datagrid(‘getSelected’);
row.id是该行的id字段值
getSelections
返回所有选中的行,当没有选中的记录时,将返回空数组。
需要正确的idField,如果idField不对,只会返回一行
返回的是行组成的数组
比如:
var rows=$(‘#gogogo’).datagrid(‘getSelections’);
rows.length是行数
rows[0].id是第一行的id字段值
今天的文章EasyUI中datagrid获取选择行的相关总结分享到此就结束了,感谢您的阅读,如果确实帮到您,您可以动动手指转发给其他人。
版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。
如需转载请保留出处:http://bianchenghao.cn/28457.html