Making an sn-choice-list read only

petercawdron · ‎07-04-2021

Until the new React JS gets baked into ServiceNow, we have to continue using the angular JS portal. One useful component is the sn-choice-list, but like all of these kind of components, it is POORLY documented. There are some useful community posts that help...

..but the one feature that's missing is how to set it to be read only. It's a little obscure as any value will trigger it, so it takes a little savvy to find a workaround. Here's how you can do it...

Your HTML should have a functioning sn-choice-list (I've left out the details as I'm only focusing on the read only aspect of the control)

<sn-choice-list readOnly = "{{c.readOnlyChoiceList}}"></sn-choice-list>

Then in your client side controller, you need a simple angular calculation

c.readOnlyChoiceList = c.data.readOnly ? 'Hidden':'';

c.data.readOnly is a true/false value coming from the server. The key is a blank string equals visible, anything else will result in a readOnly disabled control.

Hope this helps