Erledigt: Bei fehlerhafter Formulareingabe springt Browser nicht zum falschen Feld

[strich-sieben]

Hallo, konnte das oben beschriebene Problem teilweise mittels Javascript im Template lösen:

<script>
setTimeout(function() {
    document.querySelector('.error').scrollIntoView();
});
setTimeout(function() {
    document.querySelector('.error').scrollIntoView();
}, 1000);
document.querySelector('.error').scrollIntoView();
</script>

Jetzt wird aber das Formular mit den fehlerhaften Feldern noch vom Header verdeckt. Ich schaffe es aber nicht, der Funktion srollIntoView ein margin-top hinzuzufügen. Hat da jemand eine Idee, wie das klappen könnte?

Habe weder im Forum noch bei Google eine Lösung gefunden.

[zoglo]

JavaScript - Scroll Into View With Offset
https://letmegooglethat.com/?q=JavaS...ew+With+Offset

Schau bitte hier:
https://amitd.co/code/javascript/scr...ew-with-offset

Das ist Offtopic und hat nichts mit Formularen zu tun sondern mit JavaScript.
Dein TimeOut hilft hierbei nicht, füge ein Offset des Headers hinzu...

[strich-sieben]

Wäre es nicht wünschenswert, wenn Contao diese Funktion standardmäßig implentiert hätte? Ansonst geht der normale User bei einem Formular, das weiter unten auf der Seite steht, doch davon aus, dass das Formular versendet wurde.

Bin auch kein Javascript-Profi und habe keine Ahnung, wie ich das machen soll . Suche nach irgendeiner Lösung, die das Problem behebt.

[Spooky]

Wäre es nicht wünschenswert, wenn Contao diese Funktion standardmäßig implentiert hätte?

Das ist schon der Fall. Aktiviere das "js_autofocus" Template im Seitenlayout.

[strich-sieben]

Das ist schon der Fall. Aktiviere das "js_autofocus" Template im Seitenlayout.

Super, das funktioniert soweit. Leider wird auch hier das anzuzeigende Formularfeld vom Header verdeckt.

[strich-sieben]

Es war noch die HTML5 Validierung angeklickt. Jetzt sollte alles funktionieren