Different options based on Enum property

0
Hi Community, I'm doing my XML file for my widget. I was wondering if it's possible to show different fields based on the Enum choice. For example, I have the following property. I would like to show an "Enumeration or Boolean" property when they select "radioButton" and an "Boolean" property when they select "checkBox".    <enumerationValues>                         <enumerationValue key="radioButton">Radio button</enumerationValue>                         <enumerationValue key="checkBox">CheckBox</enumerationValue>  </enumerationValues>
asked
1 answers
1

image.png

 

This is my xml file. I am showing different option by using inputconversionRate Enumeration.

 

This is props.d.ts file.

image.png

 

These are Prop types. First you need to import these types in  .editorConfig.ts file.

 

Example Code: -

import { TemperatureConverterPreviewProps,InputConversionRateEnum } from "../typings/TemperatureConverterProps";

 

Then you need define which key you want to hide when an enum value selected.

Example Code: -

const keysToHideByTemp: Record<InputConversionRateEnum, Array<keyof TemperatureConverterPreviewProps>> = {

    C: ["placeholder", "decimalPrecision"], // Enum option --> [keys to hide]

    F: ["inputValue", "decimalPrecision"], // Enum option --> [keys to hide]

    K: ["inputValue", "decimalPrecision"] // Enum option --> [keys to hide]

};

When C is selected in enum then placeholder and decimalPrecision key will hide in mendix modeler.

1. InputconvertionRateEnum = This is my Enum

2. TemperatureConverterPreviewProps = this is my preview props

 

After that you need configure getProperties function. In hidePropertiesIn function you need to pass (defaultProperties, values, [...keysToHideByTemp[values.inputConversionRate]]). KeysToHideByTemp takes your enumeration key that you found in values attribute.

 

Example Code: -

export function getProperties(

    values: TemperatureConverterPreviewProps,

    defaultProperties: Properties,

): Properties {

    hidePropertiesIn(defaultProperties, values, [

        ...keysToHideByTemp[values.inputConversionRate],

    ]);

 

    return defaultProperties;

}

answered