Appearance
Dynamic Config
We renamed Setters to Dynamic Config as it's purpose may be the same but its use has changed dramatically. Dynamic Options can be a URL or Function, similar to our Options.
String
html
<IuInput options="/api/endpoint/{<otherFieldValue>}/{<otherFieldValue>}"></IuInput>
For Endpoints we have come up with a solution where all you need to define is your targetUrl. Dynamic fields trigger new API calls whenever one of the given field(s) changes.
Function
vue
<!-- watch the location Field -->
<IuInput
label="field"
name="field"
:dynamic-config="[
'location',
(newLocation) => {
return {
value: newLocation,
validations: newLocation === 'berlin' ? 'min:10' : '',
validationMessages: {
min: '{field} muss schon länger sein',
},
}
},
]"></IuInput>
Functions are a new way to define your Dynamic Configuration. We see this especially for Forms being built with our Components outside a WYSIWYG context.
Functions are defined as a tuple of field(s) to watch and a callback that return an object in the shape of the Response Schema. The field to watch can be a fieldName of your form or an array of fieldNames. Depending on that the callback receives a value or an array of values as an argument.
Response Schema
Value
json
{
"value": "newValue"
}
Values can be set by returning the new value within the value
key.
Validation
json
{
"validations": "required|min:2",
"validationMessages": {
"required": "This Field is required.",
"min": "This Field needs at least 2 Characters."
}
}
Validations as well as their messages can be set by returning the new value within the validation
and validationMessages
key.
SubmitUrl
json
{
"submit": "www.your-new-url.com"
}
the submit url can be overwritten with a given submit
key's value.
INFO
This only works at Form context
min/max
json
{
"min": "2010-12-24",
"max": "+5D"
}
For Datefields like IuDateField
and IuDatePicker
you can also return min and max from dynamicConfig endpoints or functions to set the specific min/max values in the formats specified here. If you want to also update validation messages for the automatic registered validationRules you can set it under the validationMessages
key as described above. The rules names are min_date
and max_date
.