Was sind FlexForms in TYPO3?

FlexForm ist eine Möglichkeit, Daten in einem XML Format in einer einzigen Datenbankspalte zu speichern. Sie findet Einsatz im TYPO3 Backend.

Eine FlexForm in TYPO3 ist eine XML-Struktur. Sie wird genutzt, um Formulare zu definieren und mit ihren Werten zu speichern. Die Speicherung findet in einer Datenbankspalte, in der Regel pi_flexform, statt.

Dadurch lassen sich beliebig viele Felder definieren, ohne komplexe Datenbankstrukturen zu erstellen oder die Notwendigkeit zu haben, viele einzelne Datenbankspalten zu erstellen. 

Dadurch reduziert man die Anzahl der Spalten vor allem in der tt_content - Tabelle. Diese neigt oft durch die Installation von Extensions immer breiter zu werden.

Wo werden FlexForms genutzt?

Die FlexForms werden vor allen in Frontend Plugins genutzt, können aber auch bei anderen Inhaltselementtypen (CType) zum Einsatz kommen.

In der Welt der Frontend-Plugins ist das die einzige Möglichkeit, Felder zu erstellen. Diese Felder und die zugewiesenen Werte in diesen Feldern wird dann als XML String in der Datenbankspalte pi_flexform abgelegt.

Die Felder werden dann unter dem Reiter: Plugin bei den Frontend-Plugins als Plugin Options angezeigt.

Hier ein Beispiel aus der TYPO3 Extension News:

FlexForms aus dem Frontend Plugin News System

Alle Felder unterhalb der Plugin Options stammen aus der FlexForm Konfiguration, welche wie gesagt eine XML-Struktur ist.

Diese wird in einer separaten Datei definiert. Das sieht dann ungefähr so aus:

<?xml version="1.0" encoding="utf-8" standalone="yes" ?>
<T3DataStructure>
    <sheets>
        <sDEF>
            <ROOT>
                <TCEforms>
                    <sheetTitle>LLL:EXT:t3templates_base/Resources/Private/Language/locallang_pricecard.xlf:flexform.tab.general</sheetTitle>
                </TCEforms>
                <type>array</type>
                <el>                    
                    <currency>
                        <TCEforms>
                            <label>LLL:EXT:t3templates_base/Resources/Private/Language/locallang_pricecard.xlf:flexform.tab.general.currency</label>
                            <required>1</required>
                            <config>
                                <type>input</type>
                                <size>1</size>
                            </config>
                        </TCEforms>
                    </currency>
                </el>
            </ROOT>
        </sDEF>
    </sheets>
</T3DataStructure>

Die XML-Struktur ist eine T3DataStructure. Diese besteht aus Reitern (sheets). Jeder Reiter (hier: sDEF) besteht aus einer TCEforms, welche wiederum ein Titel und ein oder mehrere Elemente hat. Ein Element ist quasi ein Feld.

In dem obigen Beispiel gibt es 1 Reiter mit dem Namen: sDEF. Der Name ist kein Zufall mit sDEF wird der Defaultreiter bezeichnet. Mittlerweile kann er auch den Namen: main haben. Es ist notwendig, dass der erste Reiter sDEF oder main heisst.

Ein Reiter besitzt dann einen Titel (sheetTitle) der, in diesem Fall, aus einer Sprachdatei geladen wird. Alternativ ist es ebenfalls möglich, den Titel hier direkt einzutragen, wenn er nicht übersetzbar sein soll.

Die obere FlexForm hat ein Element mit dem Namen: currency, welches ein normales Eingabefeld (input) ist. Alle Elemente kommen in den Container: <el>.

Wenn dann das Frontend Plugin gespeichert wird, dann sieht die gespeicherte XML-Struktur in der tt_content Tabelle in der Datenbankspalte: pi_flexform wie folgt aus:

<?xml version="1.0" encoding="utf-8" standalone="yes" ?>
<T3FlexForms>
    <data>
        <sheet index="sDEF">
            <language index="lDEF">
                <field index="currency">
                    <value index="vDEF">€</value>
                </field>
            </language>
        </sheet>
    </data>
</T3FlexForms>

Bei der Benennung der Elemente kann man für Frontend Plugins einen Trick anwenden. Wenn man die Namen der Elemente: settings. vorran stellt, also im oberen Beispiel wäre es: settings.currency, dann werden diese automatisch dem Controller und der View übergeben.

Der Zugriff innerhalb einer Controller - Klasse ist dann:

$this->settings['currency']

und in der View, also innerhalb der Templatedateien, wäre er:

{$settings.currency}

Das besondere ist, dass man die Elemente dann nicht explizit vom Controller in die View mit $this->view->assign(...) übergeben muss. Man muss auch die Variable: $settings nicht manuell in die Partial - Dateien übergeben. Das geschieht voll automatisch.

Falls man sich jedoch entscheidet nicht diesen Trick zu benutzen. Dann gibt es ab TYPO3 12 einen FlexFormProcessor der ohne viel Konfiguration die XML-Struktur in ein assoziatives Array umwandeln und der View bereitstellen kann.

Im Falle eines Frontend Plugins muss der DataProcessor dann dem CType: list zugeordnet werden. Das sieht dann ungefähr so aus:

tt_content.list.dataProcessing {
  10 = \TYPO3\CMS\Frontend\DataProcessing\FlexFormProcesso
  10 {
   fieldName = pi_flexform
    as = flexForm
  }
}

Dann stehen alle Elemente aus dieser FlexForm der Fluidvariable: flexForm zur Verfügung. Der Name der Viewvariable bei as ist frei vergebbar.

Welche FlexForms Felder gibt es?

Es gibt im Prinzip alle Felder als FlexForm, die du im TYPO3 Backend findest. Diese korrespondieren auch mit dem HTML Formularfelder.

Es gibt einzeilige und mehrzeilige Eingabefelder, RTE Felder, Auswahlfelder, Checkboxen, Kategoriebäume oder Felder für Bilder bzw. Medien im Allgemeinen.

Unter den Code Snippets im T3 Campus findest du Codebeispiele als Kopiervorlagen zu diversen FlexForm Feldern in dem Artikel: Beispielkonfiguration von FlexForm - Feldern

Probiere diese am besten einmal aus. Praxis ist die effektivste Art zu Lernen.

Bereit mehr zu lernen?

Dann komme in meine TYPO3 Onlineschule

Als Mitglied des T3 Campus für TYPO3 Schulungen erhältst du eine einzigartige Lernplattform, um professionelle Webseiten mit TYPO3 zu erstellen. Egal, ob du ein Einsteiger, Umsteiger oder bereits erfahren bist – hier findest du die passenden Lernvideos für dich.

Kevin Chileong Lee

Gründer vom T3 Campus, TYPO3 Experte mit 10+ Jahren Erfahrung, TYPO3 Liebhaber.

Ich helfe dir dabei, deine Projekte in TYPO3 umzusetzen.

Insbesondere für TYPO3 Einsteiger biete ich zahlreiche kostenfreie Tutorials und kostenpflichtige Kurse rund um TYPO3 an.
Damit kannst du in wenigen Tagen auch ohne Vorkenntnisse deine erste TYPO3 Webseite erstellen und Erweiterungen programmieren.

Auf meinem YouTube-Kanal findest du viele praktische Beispiele und Videotutorials als auch allgemein Videos zu diversen TYPO3 Themen.

Neber den TYPO3 Tutorials und Kopiervorlagen, schreibe ich auch Artikel auf meinem Blog über diverse Themen und Fragen, die die meisten TYPO3 Einsteiger, haben.

Falls du ein TYPO3 Coaching suchst, dann stehe ich dir in einer 1:1 Trainingssession zur Verfügung.

Wenn du auf dem Laufenden sein möchtest über meine Projekte, dann abonniere den Newsletter.