Appearance
Conditions
Global Ruleset:
We wanted to have the same behaviour for every value in our System. You should never have the feeling that something odd is happening. Because of this we defined a simple ruleset that looks like this:
javascript
return field === undefined || field === ''
This being said only undefined and "" are considered falsy. 0 is considered as a valid numeric value.
Display
If you want to display a field only when certain conditions are given, you can do so by using the display attribute.
Key
| Name | Type |
|---|---|
| display | string | array | function |
Code Example
html
<IuInput display="<otherFieldName>"></IuInput>
<IuInput :display="[<otherFieldName1>, <otherFieldName2>]"></IuInput>
<IuInput
:display="(store, getFieldstate) => !!store.<otherFieldName> && !!getFieldState(<otherFieldName>?.isDisplayed"></IuInput>
Disabled
If you want to disable a field when certain conditions are given, you can do so by using the disabled attribute.
Key
| Name | Type |
|---|---|
| display | string | array | function |
Code Example
html
<IuInput disabled="<otherFieldName>"></IuInput>
<IuInput :disabled="[<otherFieldName1>, <otherFieldName2>]"></IuInput>
<IuInput :disabled="(store) => !!store.<otherFieldName>"></IuInput>
WARNING
To fit the naming of disabled we use a Logical Not Operator for our disabled conditions.