I have a requirement where I have implemented the lightning-dataTable with the custom-dataType column checkbox.
As you can see in the screenshot, I have a requirement where
- onCheck of the parent row(in dark-grey background) all the child rows should be selected,
- if any child is unselected then the parent rows should be unselected, and so on...
My Component structure is as follows :
//customCheckbox component - customCheckbox.html - customCheckbox.js
//customDataTypes component extending lightning-datatable - customCheckboxRender.html - customDataTypes.html - customDataTypes.js
//parent component - parent.html - parent.js
Oncheck of the checkbox, I am not able to read the other checkboxes columns, customCheckbox.html is as follows :
I have tried the following and all are showing null, kindly refer the screenshot
1.this.template.querySelectorAll('lightning-input[data-id="a3i1y000000HLeQAAW"]') is giving null 2.this.template.querySelectorAll('[data-id="a3i1y000000HLeQAAW"]') is giving null 3.this.template.querySelectorAll('lightning-input').length is giving 0.
Can any one help me read the individual checkbox with the data-id attribute, inorder to make it checked==true or disabled or checked==false.