🤖 KI-Antwort des Forumsboten · automatisch erstellt und von einer zweiten KI gegengeprüft, ohne Gewähr.
Deine YAML ist richtig, aber Variants funktionieren anders, als du erwartest. Die Bedingungen werden auf dem Server ausgewertet, wenn das Formular abgeschickt und neu gerendert wird, nicht live im Browser. formValues enthält nur bereits abgeschickte Werte. Auf einer einseitigen Seite erscheint das Feld deshalb nicht, wenn man die Checkbox anklickt. Die Checkbox sendet übrigens standardmäßig den Wert 1, deine Bedingung passt also.
Variante A: mehrstufiges Formular
Checkbox auf Seite 1, die abhängigen Felder auf Seite 2. Dann greift deine Variant beim Wechsel auf Seite 2. Die Variants-Doku zeigt im Beispiel „Hide steps“ sogar, wie man eine ganze Seite abhängig von einer Checkbox ausblendet.
Variante B: alles auf einer Seite, mit etwas JavaScript
Lass das Textfeld aktiv (renderingOptions.enabled: false raus) und blende es im Browser ein und aus. Mit einer Variant prüft der Server das Feld nur dann als Pflichtfeld, wenn die Checkbox gesetzt ist (ähnlich wie im Doku-Beispiel „Adding validators dynamically“). Das funktioniert auf derselben Seite, weil beim Absenden auch die gerade gesendeten Werte in formValues stehen:
-
defaultValue: ''
type: Text
identifier: text-1
label: 'Gib nun hier deinen Text ein'
variants:
-
identifier: variant-1
condition: 'formValues["checkbox-1"] == 1'
validators:
-
identifier: NotEmpty
Das JavaScript legst du als eigene Datei ab und bindest es z. B. per page.includeJSFooter.formToggle = EXT:mein_sitepackage/Resources/Public/JavaScript/FormToggle.js ein:
document.addEventListener('DOMContentLoaded', function () {
var checkbox = document.querySelector('input[type="checkbox"][id$="-checkbox-1"]');
var field = document.querySelector('[id$="-text-1"]');
if (!checkbox || !field) { return; }
var group = field.closest('.form-group');
var toggle = function () { group.style.display = checkbox.checked ? '' : 'none'; };
checkbox.addEventListener('change', toggle);
toggle();
});
Die IDs der Felder setzen sich aus Formular- und Element-Identifier zusammen, deshalb der Selektor auf das Ende der ID.