FlexFormProcessor

TYPO3 offers FlexForms which can be used to store data within an XML structure inside a single database column. The data processor \TYPO3\CMS\Frontend\DataProcessing\FlexFormProcessor converts the FlexForm data of a given field into a Fluid-readable array.

Options

fieldname
Required

false

Data type

string

Default

'pi_flexform'

Field name of the column the FlexForm data is stored in.

references

New in version 13.0.

Required

false

Data type

array

Associative array of FlexForm fields (key) and the according database field (value).

Each FlexForm field, which should be resolved, needs a reference definition to the foreign_match_fields. This reference is used in the FilesProcessor to resolve the correct FAL resource.

See Example of resolving FAL references.

as
Required

false

Data type

string

Default

'flexFormData'

Name for the variable in the Fluid template.

Examples

Example of a minimal TypoScript configuration

EXT:my_extension/Configuration/TypoScript/setup.typoscript
# Before TYPO3 v12.1 you have to specify the fully-qualified class name of the processor
# dataProcessing.10 = TYPO3\CMS\Frontend\DataProcessing\FlexFormProcessor
# Since TYPO3 v12.1 one can also use the available alias
10 = flex-form

New in version 12.1: One can use the alias flex-form instead of the fully-qualified class name \TYPO3\CMS\Frontend\DataProcessing\FlexFormProcessor.

The converted array can be accessed within the Fluid template with the {flexFormData} variable.

Example of an advanced TypoScript configuration

EXT:my_extension/Configuration/TypoScript/setup.typoscript
# Before TYPO3 v12.1 you have to specify the fully-qualified class name of the processor
# dataProcessing.10 = TYPO3\CMS\Frontend\DataProcessing\FlexFormProcessor
# Since TYPO3 v12.1 one can also use the available alias
10 = flex-form
10 {
    fieldName = my_flexform_field
    as = myOutputVariable
}

The converted array can be accessed within the Fluid template with the {myOutputVariable} variable.

Example with a custom sub-processor

EXT:my_extension/Configuration/TypoScript/setup.typoscript
# Before TYPO3 v12.1 you have to specify the fully-qualified class name of the processor
# dataProcessing.10 = TYPO3\CMS\Frontend\DataProcessing\FlexFormProcessor
# Since TYPO3 v12.1 one can also use the available alias
10 = flex-form
10 {
    fieldName = my_flexform_field
    as = myOutputVariable
    dataProcessing {
        10 = Vendor\MyExtension\DataProcessing\CustomFlexFormProcessor
    }
}

Example of resolving FAL references

New in version 13.0.

Example of an advanced TypoScript configuration, which processes the field my_flexform_field, resolves its FAL references and assigns the array to the myOutputVariable variable:

EXT:my_extension/Configuration/TypoScript/setup.typoscript
10 = flex-form
10 {
  fieldName = my_flexform_field
  references {
    my_flex_form_group.my_flex_form_field = my_field_reference
  }
  as = myOutputVariable
}

The according FlexForm configuration:

Excerpt of a FlexForm configuration
<my_flex_form_group.my_flex_form_field>
    <label>LLL:EXT:sitepackage/Resources/Private/Language/locallang_be.xlf:my_flex_form_field</label>
    <config>
        <type>file</type>
        <maxitems>9</maxitems>
        <foreign_selector_fieldTcaOverride>
            <config>
                <appearance>
                    <elementBrowserType>file</elementBrowserType>
                    <elementBrowserAllowed>gif,jpg,jpeg,png,svg</elementBrowserAllowed>
                </appearance>
            </config>
        </foreign_selector_fieldTcaOverride>
        <foreign_types type="array">
            <numIndex index="0">
                <showitem>
                    --palette--;LLL:EXT:lang/locallang_tca.xlf:sys_file_reference.imageoverlayPalette;imageoverlayPalette,--palette--;;filePalette
                </showitem>
            </numIndex>
            <numIndex index="1">
                <showitem>
                    --palette--;LLL:EXT:lang/locallang_tca.xlf:sys_file_reference.imageoverlayPalette;imageoverlayPalette,--palette--;;filePalette
                </showitem>
            </numIndex>
        </foreign_types>
        <appearance type="array">
            <headerThumbnail>
                <height>64</height>
                <width>64</width>
            </headerThumbnail>
            <enabledControls>
                <info>1</info>
                <dragdrop>0</dragdrop>
                <sort>1</sort>
                <hide>0</hide>
                <delete>1</delete>
                <localize>1</localize>
            </enabledControls>
            <createNewRelationLinkTitle>
                LLL:EXT:frontend/Resources/Private/Language/locallang_ttc.xlf:images.addFileReference
            </createNewRelationLinkTitle>
        </appearance>
        <behaviour>
            <localizationMode>select</localizationMode>
            <localizeChildrenAtParentLocalization>1</localizeChildrenAtParentLocalization>
        </behaviour>
        <overrideChildTca>
            <types type="array">
                <numIndex index="2">
                    <showitem>
                        --palette--;LLL:EXT:lang/locallang_tca.xlf:sys_file_reference.imageoverlayPalette;imageoverlayPalette,--palette--;;filePalette
                    </showitem>
                </numIndex>
            </types>
        </overrideChildTca>
        <allowed>jpg,png,svg,jpeg,gif</allowed>
    </config>
</my_flex_form_group.my_flex_form_field>