How to give read-only SlickGrid cells a different background than editable cells?

Question

When the Grid loads, I'd like it to be immediately apparent to the user which cells are editable, and which are not. I tried something like:

   .slick-cell.editable
    {
        background-color: #f0f0f0;
    }

However, it seems that the 'editable' class isn't applied until the cell is made active. Also, I'm trying to make it pretty flexible, so that if the editabilty of the cell changes at run-time, the grid can be re-rendered and displayed correctly.

Answer 1

Because the "editability" of cells is determined dynamically (your can provide an onBeforeEditCell event handler), there is no way to do this declaratively. If you do know which cells are going to be editable in your application, I suggest adding a CSS class in your custom formatter.