Comment on page
Array (list of objects)
In order to use an array of objects field, add
children
and type: InputType.Array
to your FieldConfig
.It is only used for objects, if you want other arrays like
text
please use InputType.MultiText
children: { fields: FieldConfig[] },
type: InputType.Array,
interface FieldConfig {
key: string;
type: InputType.Array;
children: { fields: FieldConfig[] };
label?: string;
isDisabled?: boolean;
isRequired?: boolean;
defaultValue?: any;
}
key
: A unique identifier for the field.type
: The type of input to use for the field, as specified by theInputType
enumeration.label
: (optional) The label to display for the field.isDisabled
: (optional) A boolean value indicating whether the field should be disabled.isRequired
: (optional) A boolean value indicating whether the field is required.defaultValue
: (optional) The default value for the field.
An array of a nested set of fields for use with
InputType.Array
fields. This allows you to add, edit and delete multiple objects in an array.Properties
Here is an example of how the
children
property can be used in a FieldConfig
object:const passengersFormConfig: FormConfig = {
fields: [
{
key: "passengers",
label: "Passengers",
type: "array",
children: {
fields: [
{
key: "email",
label: "Email",
type: "text",
isRequired: true,
},
{
key: "first_name",
label: "First Name",
type: "text",
isRequired: true,
},
{
key: "last_name",
label: "Last Name",
type: "text",
isRequired: true,
},
],
},
},
],
};
In this example, the passengersFormConfig object represents a group of fields that are used to add, edit and delete multiple passengers to the form.
{
"passengers": [
{
"email": "[email protected]",
"first_name": "John",
"last_name": "Doe"
},
{
"email": "[email protected]",
"first_name": "May",
"last_name": "Smith"
}
]
}
Last modified 10mo ago