Highlight grid cell when clicked

[Alvin]

Hi,

When a user clicks a cell in the grid, is there any way to get the <td> of clicked cell in order to modify the styling (for example, add a solid border) as a way of highlighting the clicked cell? I would like the cell to remain highlighted until I programmatically clear the highlighting, so that I can highlight more than one cell. Please note this has nothing to do with editing.

I'd appreciate any pointers. Thanks in advance.

Alvin

[Dimiter Topalov]

Hi Alvin,

It seems the Grid built-in Cell Selection feature could be a good fit for the desired functionality:

https://www.telerik.com/kendo-angular-ui-develop/components/grid/selection/cell-selection/#toc-multiple-cells-selection

https://www.telerik.com/kendo-angular-ui-develop/components/grid/selection/persisting/#toc-persisting-the-cell-selection

The built-in selection styling could be customized through CSS, e.g.:

https://stackblitz.com/edit/angular-bhmgsr?file=app/app.component.ts

Alternatively, the Grid cellClick event could be utilized to capture the clicked TD element and add some arbitrary class to it that can subsequently be removed programmatically when the developer sees fit, e.g.:

https://stackblitz.com/edit/angular-6in2qp?file=app/app.component.ts

I hope this helps.

Regards,
Dimiter Topalov
Progress Telerik

[Alvin]

Hi Dimiter,

That's very helpful. Thanks for the Stackblitz examples.

Regards,

Alvin