0

This question was asked 2.5 years ago, the answer was "no" then, and I've seen many other requests for this feature. Are we still not able to conditionally disable the checkboxes in a lightning datatable?

Are there any kind of workarounds? If we could edit the cellAttributes for the checkbox column, I could add a CSS class to hide checkboxes, but I don't think we can even do that?

Perhaps even someone has created a custom lightning datatable component that inherits from lightning-datatable, and adds this capability?

2
  • lighting namespaced resources have many limitations - why not simply create your own data table using the slds blue prints, or extend the lightning data-table component? the static resource workaround is not guaranteed to work in future releases
    – glls
    Commented Jul 13, 2021 at 17:12
  • @glls - yeah we might end up going the custom extended datatable route. I'm curious, when you say "static resource workaround", what are you referring to? Calvin Okeefe's answer below I don't believe is valid, as it doesn't apply to the default checkbox row select column as mentioned in my comment on his answer.
    – jbyrd
    Commented Jul 14, 2021 at 13:53

1 Answer 1

0

Here is the workaround I have used to inject CSS into a datatable

first create a static resource called something like DatatableStyles.css that should have a css property like so.

.hideCheckbox{
   visibility:hidden;
}

Upload this to your instance of Salesforce as a new static resource and name it "DatatableStyles" (or whatever you'd like to call it but make sure the js below reflects the name you choose).

Next in your LWC import the resource like so

import { loadStyle } from "lightning/platformResourceLoader";
import DatatableStyles from "@salesforce/resourceURL/DatatableStyles"

now add a cellAttributes tag to the table column you would like to dynamically hide the checkbox in like so (Documentation for adding cell attributes to data can be found here

cellAttributes: {
   class: {
     fieldName: "checkBoxCSS"
   }
}

now just add the field checkBoxCSS to the object you are trying to hide and give it the css property you want it to have like so

myObject.checkBoxCSS= "hideCheckbox"

my advice would be to do the logic for deciding which objects get this property in the javascript otherwise you will have to make a wrapper class in your apex in order to give your object this field. It took me quite a bit of trial and error to get this working so best of luck

1
  • Hey Calvin, thanks for your answer, but does lightning-datatable even allow columns with checkboxes? According to the documentation (In the section "Formatting with Data Types"), a checkbox is not even an allowed data type, so I'm not sure what you're referring to? I'm talking about the default checkbox selection column that appears unless you specify hide-checkbox-column.
    – jbyrd
    Commented Jul 13, 2021 at 18:46

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .