Open Forms TS types
    Preparing search index...

    Interface EditGridComponentSchema

    Component shape/options for the edit grid component.

    Edit grids are used for "repeating groups". The components configuration inside the editgrid component describes a blueprint for each item - effectively creating a list of nested forms with all their usual features.

    The intrinsic data type is an array of objects, where the shape of each object is described by the component.components property.

    The generated documentation might be slightly off due to rendering the type alias as an interface. Double check with the actual TS types!

    interface EditGridComponentSchema {
        addAnother?: string;
        clearOnHide?: boolean;
        components: AnyComponentSchema[];
        defaultValue?: null | unknown[];
        description?: string;
        disableAddingRemovingRows: boolean;
        groupLabel: string;
        hidden?: boolean;
        hideLabel?: boolean;
        id: string;
        isSensitiveData?: boolean;
        key: string;
        label: string;
        openForms?: {
            translations?: {
                en?: {
                    addAnother?: string;
                    description?: string;
                    groupLabel?: string;
                    label?: string;
                    removeRow?: string;
                    saveRow?: string;
                    tooltip?: string;
                };
                nl?: {
                    addAnother?: string;
                    description?: string;
                    groupLabel?: string;
                    label?: string;
                    removeRow?: string;
                    saveRow?: string;
                    tooltip?: string;
                };
            };
        };
        removeRow?: string;
        saveRow?: string;
        tooltip?: string;
        type: "editgrid";
        validate?: { maxLength?: number; required?: boolean };
    }
    Index

    Properties

    addAnother?: string

    Button label to add another item.

    clearOnHide?: boolean

    Clear the value (remove the key from the submission data) when the field is hidden. This is applied if the component itself or any parent is hidden, irrespective the mechanism that made it hidden.

    Related: hidden, conditional.

    components: AnyComponentSchema[]

    Form definition for each item in the repeating group.

    defaultValue?: null | unknown[]

    The default/initial value to populate the field with if no value is set yet.

    The typevar T determines the (intrinsic) value type of the component. If the component supports the multiple property, use the WithMultiple type instead.

    description?: string

    Additional information for the form field, displayed unconditionally.

    disableAddingRemovingRows: boolean

    Control whether any rows can be added or removed.

    groupLabel: string

    Label for an individual item, interpolated with the index of each item.

    Specific to Open Forms.

    hidden?: boolean

    Hide or show the form field. This only controls the visibility - whether submission data is retained or not is controlled through clearOnHide.

    hideLabel?: boolean

    If enabled, the label of the group will not be displayed.

    id: string

    Unique ID for a component in a form definition. Used to render HTML IDs.

    The new renderer does not need this.

    isSensitiveData?: boolean

    Marker for a form field that requests potentially (privacy) sensitive information.

    Pruning of submission data will clear the data of components marked as sensitive data.

    This is specific to Open Forms.

    key: string

    Unique key for the component in a larger form definition.

    The value must comply with the (\w|\w[\w.\-]*\w) regex, meaning that periods/dots are allowed unless they're start or end. The period character creates a nesting level in the submission data.

    'myField'
    
    'parent.child' // creates `{parent: {child: <value}}` data.
    
    label: string

    The form field label text.

    openForms?: {
        translations?: {
            en?: {
                addAnother?: string;
                description?: string;
                groupLabel?: string;
                label?: string;
                removeRow?: string;
                saveRow?: string;
                tooltip?: string;
            };
            nl?: {
                addAnother?: string;
                description?: string;
                groupLabel?: string;
                label?: string;
                removeRow?: string;
                saveRow?: string;
                tooltip?: string;
            };
        };
    }
    removeRow?: string

    Button label to remove a single item or cancel editing it.

    saveRow?: string

    Button label to save/confirm a single item.

    tooltip?: string

    Extra information or background for the form field. Displayed after interacting with the tooltip icon/control near the label.

    type: "editgrid"

    Discriminator to determine the component type. Uniquely determines the shape of the component configuration options.

    validate?: { maxLength?: number; required?: boolean }

    The validation configuration of the component.

    Type declaration

    • OptionalmaxLength?: number

      Maximum length of a value for text-based fields.

    • Optionalrequired?: boolean

      Set to true to require a non-empty value to be provided for the field.