Select all checked rows in datagrid

[esteen]

When using the datagrid, it is easy to add a checkbox for each row. However, it seems a method such as .datagrid("getChecked") is missing, which would return all rows where the checkbox has been selected, in the same way as .datagrid("getSelections") return all rows that have been selected.

How can we accomplish this with the datagrid component?

[stworthy]

It is easy to extend the 'getChecked' method for datagrid. The example below shows how to implement this method:

Code:

$.extend($.fn.datagrid.methods, {
	getChecked: function(jq){
		var rr = [];
		var rows = jq.datagrid('getRows');
		jq.datagrid('getPanel').find('div.datagrid-cell-check input:checked').each(function(){
			var index = $(this).parents('tr.datagrid-row:first').attr('datagrid-row-index');
			rr.push(rows[index]);
		});
		return rr;
	}
});

[esteen]

This does not work when we have alternating rows (striped: true), then class is empty or datagrid-row-alt:

<tr class="" datagrid-row-index="0" style="height: 28px;">
<tr class="datagrid-row-alt" datagrid-row-index="1" style="height: 28px;">
<tr class="" datagrid-row-index="2" style="height: 28px;">
<tr class="datagrid-row-alt" datagrid-row-index="3" style="height: 28px;">
<tr class="" datagrid-row-index="4" style="height: 28px;">
<tr class="datagrid-row-alt" datagrid-row-index="5" style="height: 28px;">
<tr class="" datagrid-row-index="6" style="height: 28px;">
<tr class="datagrid-row-alt" datagrid-row-index="7" style="height: 28px;">
<tr class="" datagrid-row-index="8" style="height: 28px;">
<tr class="datagrid-row-alt" datagrid-row-index="9" style="height: 28px;">
<tr class="" datagrid-row-index="10" style="height: 28px;">
<tr class="datagrid-row-alt" datagrid-row-index="11" style="height: 28px;">
<tr class="" datagrid-row-index="12" style="height: 28px;">
<tr class="datagrid-row-alt" datagrid-row-index="13" style="height: 28px;">
<tr class="" datagrid-row-index="14" style="height: 28px;">

Seems to work with:

jq.datagrid('getPanel').find('div.datagrid-cell-check input:checked').each(function(){
         var index = $(this).parents('tr:first').attr('datagrid-row-index');
         rr.push(rows[index]);
      });

[stworthy]

Try using the latest version of easyui, otherwise rewrite the 'getChecked' method as below:

Code:

$.extend($.fn.datagrid.methods, {
	getChecked: function(jq){
		var rr = [];
		var rows = jq.datagrid('getRows');
		jq.datagrid('getPanel').find('div.datagrid-cell-check input:checked').each(function(){
			var index = $(this).parents('tr:first').attr('datagrid-row-index');
			rr.push(rows[index]);
		});
		return rr;
	}
});