[英]Get list of selected rows from Kendo grid in Angular 2+
I'm using the Kendo for Angular grid in an Angular 4 application. 我在Angular 4应用程序中使用Kendo for Angular网格。 I have selectable set to 'true', a column in my grid with the kendo-grid-checkbox-column, and selectionChange set to a function that takes the event parameter as an argument.
我已经将selectable设置为'true',在网格中有kendo-grid-checkbox-column的列中,并将selectionChange设置为将事件参数作为参数的函数。
In my selectionChange handler, the selectedRows array on the event parameter only has one value in it, regardless of how many rows are selected. 在我的selectionChange处理程序中,无论选择多少行,事件参数上的selectedRows数组都只有一个值。
Thanks, James 谢谢,詹姆斯
My code: 我的代码:
onGridSelectionChange(event: SelectionEvent) { debugger; console.log(event.selectedRows.length); // this is always 1 };
<kendo-grid *ngIf='!isLoading' style="width:100%; height: inherit;" class="ag-fresh" [data]='gridView' [selectable]="true" [pageSize]='pageSize' [skip]='skip' [pageable]='true' (pageChange)='onGridPageChange($event)' (selectionChange)='onGridSelectionChange($event)'>
Take a look at the following example: 看下面的例子:
All selected keys are kept in a collection (mySelection) that we can also manipulate to select/deselect rows programmatically. 所有选择的键都保存在一个集合(mySelection)中,我们还可以操纵该集合以编程方式选择/取消选择行。 Instead of keeping the keys, you can keep the whole objects, representing the selected data items instead (bind kendoGridSelectBy to a function that will return eventArgs.dataItem).
除了保留键之外,还可以保留整个对象,它们代表所选数据项(将kendoGridSelectBy绑定到将返回eventArgs.dataItem的函数)。
You are using the wrong event of the grid. 您正在使用错误的网格事件。 You should use
selectedKeysChange
您应该使用
selectedKeysChange
<kendo-grid ...
[kendoGridSelectBy]="'id'"
(selectedKeysChange)="selectedKeysChange($event)">
...
</kendo-grid>
Also, you have to set the field used to select the row ( kendoGridSelectBy
). 另外,您必须设置用于选择行的字段(
kendoGridSelectBy
)。 In this example it's the ID. 在此示例中,它是ID。
Get the selection: 得到选择:
selectedKeysChange(rows: number[]) {
console.log(rows);
}
change [selectable]="true" to: 将[selectable] =“ true”更改为:
[selectable]="{enabled: true, mode: 'multiple'}" [selectable] =“ {启用:true,模式:“多个”}”
when I added the mode: 'multiple' I was able to get the list.. 当我添加模式:“多”时,我能够获得列表。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.