[IGN-4425]Perspective Radio Group - Disable individual radios within group

Ignition
1

Hello,
I’d like to be able to disable one or more options in a radio button group under certain conditions. Using the radio group component, the props.enabled property controls the entire group.
image
If I create 3 separate groups with a single radio in each, within the same container, then I can control the enable/disable individually, but I lose the mutual exclusivity among siblings.
I have also tried adding an enabled property to props.radios[x] elements but the designer complains about a schema violation, and it doesn’t work in any case.

Does anyone know of a workaround to achieve the same functionality of vision radio buttons within a group?

2

I don’t think there are any good workarounds, since we don’t expose individual styling or controls per radio. I think it might theoretically be possible to set pointer-events: none via a CSS selector for a specific child element of the radio group, but that would affect every group on the page and be ‘unsafe’ - someone could always just delete the CSS and press the button anyways.

I’ve filed a ticket to see if we can expose per-radio configuration in some way.

3

Thanks for the reply.
Having the ability to style as well as control on a per radio basis would be a big win.

For now, I think I will have to create 3 separate “groups” with a single radio and use scripting to insure mutual exclusivity.

4

Rather than using radio buttons, could your requirement be fulfilled by a drop down list that you populate with the currently valid choices?

5

A Dropdown list also does allow for disabling individual options. The screenshot in the original post only contains a few options, and so maybe a Radio Group is the “best” option, but that doesn’t mean you can’t use a Dropdown. I recommend using these guidelines for basic guidance, but that doesn’t mean they are rules.