Graying out optional parameters

Description of the limitation and why it is relevant to address

As a developer, I want to easily manage the visibility status of various parameters, ensuring they are grayed out when not in use, so that the user experience is seamless and intuitive without disruptive UI movements.

I think this is relevant for the VIKTOR platform because it will make the application more user-friendly, increase the overall user satisfaction, and may potentially not only reduce the amount of user supports but also the amount of maintenance required from developers.

Submitter proposed design (optional)

One potential solution would be to enhance the “visible” attribute to allow developers to easily toggle the visibility status of fields between “active,” “hidden,” or “grayed out.”

An alternative, and potentially less disruptive, solution would be to introduce a new independent boolean attribute named ‘isActive’. This attribute would permit developers to effortlessly gray out parameters, ensuring a more seamless and user-friendly interface experience.

Current workarounds

At present, fields with the visible attribute set to ‘False’ are entirely hidden from the user’s view.

A current workaround involves structuring the application into multiple steps, where the selection in one step determines the visible fields in subsequent steps. This approach works effectively for simple scenarios with fewer parameters and straightforward relationships between them.

However, the problem arises in complex situations involving a substantial number of parameters with intricate interrelationships. The advantage of maintaining an organized and streamlined user interface diminishes, as users must navigate through numerous steps, leading to a potentially confusing and time-consuming experience. The need to constantly add and manage these multi-step processes can also introduce additional complexity and maintenance overhead for developers.

Hi Karim,

Thanks for the feature request!
Have you seen the OutputField which is also available in the SDK? And if so, could you explain why that would not be a suitable option for your use-case?

Great detailed feature request. Could you share a small example of how your code would look if this was available?

Hi, thank you for your prompt answers. Please find below an example to illustrate the situation (in the case of ‘isActive’). I can provide additional information or a real working example if necessary.

Context: the steps involved and the functions
# previous_step (prev) is an initialization step
previous_step = parametrization.Step('Previous Step',)

previous_step.standard = parametrization.OptionField(
    'Standard',
    options=[NDS_2018, NDS_2015, NDS_2010],
    flex=FLEX_DEFAULT_VALUE,)

previous_step.unit_system = parametrization.OptionField(
    'Unit system',
    options=[IMPERIAL, METRIC],
    flex=FLEX_DEFAULT_VALUE,)

# current_step (curr) is an input parameters step
current_step = parametrization.Step(
    'Current Step',
    previous_label='Previous Step ',
    next_label='Calculate',
    on_next=validate_user_inputs,)

# Functions for both with and without the proposal design
def is_NDS_2018_and_metric(params, **kwargs) -> bool:
    """Check if the previous step standard is NDS_2018 and unit_system is metric."""
    prev = params.previous_step
    return prev.standard == NDS_2018 and prev.unit_system == METRIC


def has_NDS_2018__fire_resistance_rating_metric(params, **kwargs) -> bool:
    """Check if fire_resistance_rating is set."""
    curr = params.current_step
    return (is_NDS_2018_and_metric(params, **kwargs)
            and bool(curr.NDS_2018__fire_resistance_rating_metric))


def activate_NDS_2018__wood_blocking_metric(params, **kwargs) -> bool:
    """Returns True if fire_resistance_rating is set and element_hidden is True."""
    curr = params.current_step
    return (is_NDS_2018_and_metric(params, **kwargs)
            and bool(curr.NDS_2018__fire_resistance_rating_metric)
            and curr.NDS_2018__element_hidden_metric)
Without the attribute isActive

Parameter ‘NDS_2018__wood_blocking_metric’ would move depending on visible attribute.

# Parameters example without the proposal design
current_step.NDS_2018__fire_resistance_rating_metric = parametrization.IntegerField(
    prefix='t',
    ui_name='Fire-resistance rating',
    suffix='minutes',
    min=0,
    visible=is_NDS_2018_and_metric,
    flex=FLEX_DEFAULT_VALUE,
)

current_step.NDS_2018__sides_exposed_metric = parametrization.OptionField(
    ui_name='Sides exposed',
    options=['Top', 'Bottom', 'Top and Bottom'],
    visible=has_NDS_2018__fire_resistance_rating_metric,
    flex=FLEX_DEFAULT_VALUE,
)

current_step.NDS_2018__V_fire_metric = parametrization.NumberField(
    prefix='$V_{fire}$',
    ui_name='Shear force for fire resistance design',
    suffix='kN',
    min=0,
    visible=has_NDS_2018__fire_resistance_rating_metric,
    flex=FLEX_DEFAULT_VALUE,
)

current_step.NDS_2018__wood_blocking_metric = parametrization.NumberField(
    prefix='$t_{blocking}$',
    ui_name='Wood blocking',
    suffix='mm',
    min=0,
    visible=activate_NDS_2018__wood_blocking_metric,   # The element would be hidden
    flex=FLEX_DEFAULT_VALUE,
)
With the attribute isActive

Parameter ‘NDS_2018__wood_blocking_metric’ would be grayed depending on isActive attribute.

# Parameters example with the proposal design
current_step.NDS_2018__element_hidden_metric = parametrization.BooleanField(
    ui_name='Element is hidden',
    default=False,
    visible=is_NDS_2018_and_metric,
    flex=FLEX_DEFAULT_VALUE,
)

current_step.NDS_2018__sides_exposed_metric = parametrization.OptionField(
    ui_name='Sides exposed',
    options=['Top', 'Bottom', 'Top and Bottom'],
    visible=is_NDS_2018_and_metric,
    isActive=has_NDS_2018__fire_resistance_rating_metric,
    flex=FLEX_DEFAULT_VALUE,
)

current_step.NDS_2018__V_fire_metric = parametrization.NumberField(
    prefix='$V_{fire}$',
    ui_name='Shear force for fire resistance design',
    suffix='kN',
    min=0,
    visible=is_NDS_2018_and_metric,
    isActive=has_NDS_2018__fire_resistance_rating_metric,
    flex=FLEX_DEFAULT_VALUE,
)

current_step.NDS_2018__wood_blocking_metric = parametrization.NumberField(
    prefix='$t_{blocking}$',
    ui_name='Wood blocking',
    suffix='mm',
    min=0,
    visible=is_NDS_2018_and_metric,
    isActive=activate_NDS_2018__wood_blocking_metric,  # The element would be grayed
    flex=FLEX_DEFAULT_VALUE,
)