I am trying to make a checkbox grid that some of the values are read only (it is a list of features and some features are required but I want the user to be able to see them all in one place) and retrieved via an endpoint into a store.

I tried making the items unselectable, but I could not get it to function. So, I currently have the beforeselect listener returning false if a particular feature phrase pops up (voice in this instance) so that I can possibly add similar later. The problem with this is that the header select all box will not toggle since not every checkbox is checked. Looking at the JS in the browser shows me the checkbox is a span (which personally strikes me as an odd choice but nothing I can do about it), and I haven't been able to trace what is going on behind the scenes.

The question is this. Is there a better way to make some of the rows unselectable (and thereby uneditable) while keeping the select all working properly, or is there a way to manually toggle the header checkbox since all it does is enumerate through the grid and either check or uncheck based on its state?

Thanks.