Late Starter
Late Starter

Reputation: 1109

How can I disable row selection toggling in Kendo Angular Grid?

The default row selection behaviour for the Kendo Angular grid is to toggle the selection - that is, clicking a selected (highlighted) row will deselect it (remove the highlighting), according to the documentation.

I want the selected row to remain highlighted if it is clicked repeatedly. I have been unable to find anything in the documentation that would suggest that this is possible, yet it seems like a reasonable requirement (a situation in which there must always be a row selected).

Is there perhaps a built-in, undocumented way to do this?

Upvotes: 3

Views: 6564

Answers (2)

TomerAgmon1
TomerAgmon1

Reputation: 295

The suggested answer simply does not work for me. the class is applied but k-disabled does nothing. I used the alternative pointer-events: none css property to achieve the same.

Upvotes: 1

mscottnelson
mscottnelson

Reputation: 472

I am assuming your project is Angular 2+. You could disable interaction with a row once it becomes selected by using the rowClass callback input. You might need to bind the Component's 'this' to the callback row to make sure you can get your Component keys into the callback. Something like:

Template:

<kendo-grid [rowClass]="selectionToggleCallback" [selectedKeys]="keys">

Component:

keys:Array<number> = [];
ngOnInit(){
  this.selectionToggleCallback = this.selectionToggleCallback.bind(this);
}

selectionToggleCallback(context:RowClassArgs){
  const isDisabled = this.keys.includes(context.index);
  return { 'k-disabled' : isDisabled };
}

Upvotes: 1

Related Questions