Pflichtfeld nicht ausgefüllt -> Sprung zu erstem nicht ausgefüllten Pflichtfeld

Hallo,

ich binde mein Formular (mittig) in einen Joomla Artkel ein mit dem tag {vfformview} (ohne weitere Optionen)

ich benutze die Option "Focus auf 1. Feld setzen"

Wenn nun Pflichtfelder nicht ausgefüllt wurden (und dennoch "absenden" gedrückt wird), kommt keine Popup-Meldung oder so (ist das richtig so ?),
statt dessen werden über jedem nicht ausgefüllten Pflichtfeld graue "Bubble" Hinweise eingeblendet,
so weit so gut.

Wenn nun Absenden gedrückt wurde, sollte die Browser-Ansicht wohl eigentlich zu dem "Bubble-Hinweis" des ersten nicht ausgefüllten Pflichtfeldes springen, oder ? (Formular ist höher/länger als das Browserfenster)
statt dessen wird zu dem Eingabefeld gesprungen -> da der "Bubble-Hinweis" darüber ist, ist er oben aus dem Browserfenster verschwunden (mit Scrollen natürlich wieder sichtbar), so dass der User zunächst nichts von seinem Fehler (fehlendes Pflichtfeld) mitbekommt...

Erschwerend kommt bei meinem Template hinzu, dass ich oben permanent eine Menüleiste eingeblendet habe ("sticky"),
so dass sogar das betroffene Eingabefeld (nicht ausgefülltes Pflichtfeld) oben aus dem Browserfenster verschwunden ist -> d.h. der User sieht (nach dem er "Absenden" gedrückt hat) weder den "Bubble-Hinweis" noch das nicht ausgefüllte Eingabefeld ...
beides ist oben aus dem Browserfenster herausgescrollt bzw. z.T hinter meiner "sticky" Menüleiste verschwunden...

Wie wird dieser Sprung (zu nicht ausgefüllten Pflichtfeldern) realisiert CSS / JAVA ?
Kann ich da etwas anpassen ? (zur Not auch im Code ?)

Hallo,

visForms unterstützt die Darstellung mehrerer gängiger Template-Frameworks (Bootstrap 2 bis 4, UIkit 2 und 3).
Das framework-unabhängige ‘Default Layout’ ist allerdings für jedes Formular vorausgewählt.
Es muss unter der Einstellung ‘Formular-Layout’ auf das aktive Template-Framework gesetzt werden.

visForms liefert dann das HTML-Tagging (Struktur und CSS-Klassen) genau so, wie es die Spezifikation des gewählten Template-Frameworks festlegt.
Im Falle des ‘Default Layouts’ entsteht ein Standard-HTML Formular ohne Besonderheiten.

Wenn du zum aktiven Template-Framework ein passendes Frontend-Template verwendest (welches das CSS genau so liefert, wie es die Spezifikation dieses Template-Frameworks verlangt) und du im Formular das ‘Formular-Layout’ ebenfalls passend auf das Template-Framework eingestellt hast, dann ist das Ergebnis perfekt. Die Praxis lehrt leider, dass nicht alle Frontend-Templates das zu 100% leisten. Es kommt zu Darstellungsfehlern.

Wenn du ein Template verwendest, das auf keinem der genannten Template-Frameworks basiert, dann solltest du das ‘Default Layout’ von visForms verwenden. Dann kann es aber immer sein, dass trotzdem suboptimale Ergebnisse entstehen und du mit eigenem CSS nacharbeiten musst.

Welche Optionen du für die Darstellung der Fehlermeldungen im Formular hast, hängt ebenfalls vom gewählten Template-Framework ab.
Bei einigen Frameworks ist es möglich, die Fehlermeldung nicht als "Bubble" anzuzeigen.

Das gewünschte Verhalten bei invaliden Benutzereingaben ist, dass der Focus in das Eingabefeld mit der fehlerhaften Eingabe springt, so dass der Benutzer sofort die korrekte Eingabe machen kann, ohne noch einmal zusätzlich klicken zu müssen.

Um herauszufinden, woran es bei Darstellungsfehlern im Detail hapert, oder um eine Lösung/Kombination zu finden, bei der alles Gewünschte korrekt angezeigt wird, bedarf es einer Fehleranalyse auf der betroffenen Joomla!-Instanz sowie eventuell etwas zusätzlichem CSS.

Ich hoffe du hast Verständnis dafür, dass wir diese individuelle Leistung auf deiner Joomla!-Instanz, nur gegen Bezahlung anbieten können.

Gruß,
Aicha

das von mir beschriebene Verhalten ist m.E. Template-unabhängig,
und tritt immer dann auf, wenn das Formular länger / höher ist, als der Browser-Viewport.

(Ich nutze das framework-unabhängige ‘Default Layout’ und passe es dann mit CSS an,
alle anderen Option (Template-Frameworks) funktionieren bei mir nicht.)

Das gewünschte Verhalten bei invaliden Benutzereingaben ist, dass der Focus in das Eingabefeld mit der fehlerhaften Eingabe springt,

das ist für meinen Geschmack falsch, denn dann ist die "Bubble" mit dem Fehlertext nicht mehr zu lesen -> sie ist oben aus dem Browser-Viewport gewandert (wenn das Formular länger / höher ist, als der Browser-Viewport)

dann muss ich wohl damit leben.