Eigene Backend Eingabefelder für Contao programmieren

Bevor wir loslegen

Contao beseitzt eine große Auswahl an Widgets an. In der Contao config.php finest du Sie alle, Siehe BE_FFL GLOBAL.

Contao config.php


/**
 * Back end form fields
 */
$GLOBALS['BE_FFL'] = array
(
    'text'           => 'TextField',
    'password'       => 'Password',
    'textStore'      => 'TextStore',
    'textarea'       => 'TextArea',
    'select'         => 'SelectMenu',
    'checkbox'       => 'CheckBox',
    'checkboxWizard' => 'CheckBoxWizard',
    'radio'          => 'RadioButton',
    'radioTable'     => 'RadioTable',
    'inputUnit'      => 'InputUnit',
    'trbl'           => 'TrblField',
    'chmod'          => 'ChmodTable',
    'pageTree'       => 'PageTree',
    'pageSelector'   => 'PageSelector',
    'fileTree'       => 'FileTree',
    'fileSelector'   => 'FileSelector',
    'fileUpload'     => 'Upload',
    'tableWizard'    => 'TableWizard',
    'listWizard'     => 'ListWizard',
    'optionWizard'   => 'OptionWizard',
    'moduleWizard'   => 'ModuleWizard',
    'keyValueWizard' => 'KeyValueWizard',
    'imageSize'      => 'ImageSize',
    'timePeriod'     => 'TimePeriod',
    'metaWizard'     => 'MetaWizard'
);

Eigenes Widget erstellen

Wir öffnen unsere system/modules/demo/src/Resources/contao/config/config.php und fügen dem $GLOBALS["BE_FFL"] Array ein neues Widget hinzu.

Danach erstellen wir im unserem system/modules/demo/src/Resources/Widgets/ Verzeichnis eine neue PHP Datei mit der Bezeichnung DemoWidget.php.

Code Snippet - config.php

<?php

$GLOBALS['BE_FFL']['demoWidget'] = 'DemoWidget';

Code Snippet - DemoWidget.php

<?php
 
/**
 * Class DemoWidget
 */
class DemoWidget extends Contao\Widget
{
    /**
     * @var bool
     */
    protected $blnSubmitInput = true;
 
    /**
     * @var string
     */
    protected $strTemplate = 'be_widget';
 
    /**
     * @param mixed $varInput
     * @return mixed
     */
    protected function validator($varInput)
    {
        return parent::validator($varInput);
    }
 
    /**
     * @return string
     */
    public function generate()
    {
 
        // Textfeld
        $field = sprintf(
 
           '<input type="text" name="%s" id="ctrl_%s" value="%s">',
            $this->strName,
            $this->strId,
            $this->varValue
 
        );
 
       return  $field;
 
    }
}

DemoWidget Klasse in Einzelteilen.

Ich versuche die DemoWidget Klasse grob zu skizieren.

Über die $this Referenz haben wir einen Zugriff auf das 'eval' Array, welches wir im unseren DCA definiert haben. z.B $this->mandatory; $this->maxlength; Selbstverständlich können wir das 'eval' Array mit unseren eigenen Eigenschaften erweitern. Dazu kommen noch Methoden und Eigenschaften, welches uns die Widget Klasse zur verfügung stellt.

Wichtigste Variablen und Eigenschaften:

$this->strName

Die strName Variable liefert uns das 'name' Attribute unseres Widgets. Das 'name' Attribute definieren wir in unserer DCA. Das sind die keys in dem fields Array.

$this->varValue

Damit haben wir Zugriff auf den gespeicherten Wert in der Datenbank.

$this->strId

Liefert das gleiche wie $this->strName

validator($varInput)

Bevor der Wert in der Datenbank gespeichert wird, können wir den Wert in der 'validator' Methode überprüfen.

generate()

In der Generate erzeugen wir unsere Eingabefelder.

$blnSubmitInput

Wenn wir diese Eigenschaft false setzten werden keine Daten gespeichert.

Ich empfehle jedem Contao - Entwickler sich an den core Widgets zu orientieren.

Zurück