Danke.
Wie denkst du, könnte das funktionieren?
Hier sind einige Ideen von mir, obwohl es noch einige Fragen gibt, die geklärt werden müssen:
[details=“Grundlagen, die es bereits gibt: Platzhalter. Aber aktuell ist es “alles oder nichts””]
Die einfachste Struktur, an die ich denken kann, um Formularverhalten nachzuahmen, wäre, wenn das “Formular” im Editor erscheint (der “d-editor”, der angezeigt wird, wenn man auf Thema erstellen klickt).
In diesem Editor könntest du verschiedene “Abschnitte” bereitstellen, wie zum Beispiel:
Name
Ort
Problem
Jeder Abschnittstitel wäre ein Platzhalter, sodass der Titel (z. B. Name) verschwindet, wenn der Benutzer darauf klickt.
Bislang ist die Einrichtung mit dem Theme-Komponente für Platzhalter-Text möglich.
Allerdings führt das noch nicht ganz zum gewünschten Formularverhalten, da die derzeit vorhandenen Platzhalter “alles oder nichts” erscheinen, wie ich weiter unten beschreibe.
[/details]
Formularähnliches Verhalten mit Platzhaltern. Aber wie greift man im Editor auf divs zu?
Um das mehr wie ein Formular zu gestalten, muss sich jeder Abschnitt unabhängig verhalten.
Derzeit ist es mit der Theme-Komponente für Platzhalter-Text “alles oder nichts” – wenn der Benutzer auf den Editor klickt, verschwinden alle Platzhalter-Titel.
Um also ein grundlegendes Formularverhalten zu haben, müssten nicht alle Titel gleichzeitig erscheinen oder verschwinden, sondern jeder Platzhalter-Abschnitt müsste sich unabhängig verhalten. Wenn der Benutzer also auf den Platzhalter “Name” klickt, verschwindet nur dieser Platzhalter, während die anderen Platzhalter (“Ort” und “Problem”) sichtbar bleiben.
Das wäre möglich, wenn jeder Platzhalter Teil eines eigenen div mit einer eindeutigen ID im Texteditor wäre. Dann könnte man mit jQuery den Platzhalter je nach Klick des Benutzers im entsprechenden Bereich ein- oder ausblenden. Dafür müssten jedoch separate divs innerhalb dessen hinzugefügt werden, was aktuell ein textarea ist – und ich bin mir nicht sicher, wie das geht.
Frage zu diesem Ansatz: Wie kann man auf divs innerhalb des Editors textarea zugreifen, um Aktionen auszulösen, wenn der Benutzer darauf klickt?
Alternative: Nutzung der vorhandenen Vorlagentext-Option. Aber wie macht man den Text nicht bearbeitbar?
Eine Alternative wäre wahrscheinlich, dass die Abschnittstitel beim Klicken des Benutzers nicht “verschwinden”. Die Abschnittstitel (Beispiel: Name, Ort und Problem) wären also Text, der auf der Seite bleibt. Um es im Vergleich zum aktuellen Standard für Themen-Vorlagen mehr wie ein Formular zu gestalten:
- Der Abschnittstitel-Text könnte vom Benutzer nicht bearbeitet werden (d. h.
contenteditable="false")
- Die Abschnittstrennpunkte könnten vom Benutzer nicht entfernt werden
- Es müsste unterhalb des Abschnittstitels ein Bereich vorhanden sein, in dem klar ist, dass der Benutzer Text eingeben kann. Im aktuellen Standard-Vorlage müssten sie dorthin gehen, wo der Text steht, und
Enter drücken, um Platz zum Schreiben zu schaffen.
Frage zu diesem Ansatz: Wie kann man Vorlagentext eingeben, (i) so dass dieser Text vom Benutzer nicht bearbeitet werden kann und (ii) klare Bereiche für die Eingabe von Informationen unter jedem Textteil vorhanden sind?
Vielleicht gibt es einen besseren Weg, um ein formularähnliches Verhalten zu erreichen?