Add a checkbox right above the first cell header (before the column headers)

Tags: #<Tag:0x00007f8b2b0a2cc0>
#1

Hi!

I’m trying to create a table in Angular 11 with multiple row headers, and one of them being a checkbox. I’ve found this fiddle:

http://jsfiddle.net/nw5Leomb/

And it seems to be working fine, however, on top of the very first cell header, I would like to add another checkbox, that when checked will tick all boxes bellow, similar to this:

https://handsontable.com/static/images/template/ModCustomers/nuxeo/nuxeo-illustration-1.png

How do I achieve that? I couldn’t find a way to edit this very first cell above the row headers so far…

Thanks in advance for the help!

#2

Hi @talentos.risingstar

Here is a demo that can help http://jsfiddle.net/eyk426od/1/ I’ve used the afterGetColHeader callback.

#3

Thank you for the help @aleksandra_budnik but I’ve come across a different issue now, my checkbox is in a nested header, so every a checkbox is changed somewhere else, Handsontable.Render() is called and this reset the checkbox value, is there any workaround for that?

#4

Hi @talentos.risingstar

Here is the modified example https://jsfiddle.net/handsoncode/cwg9u3ok/ where external cache saves visual indexes of selected rows for the next render cycle.

#5