Flask WTForms zum Anchor gehen, wenn Form nicht valid?

1 Antwort

1) Ergänze dein ContactForm-Objekt, welches du an das Template übergibst, einfach um ein boolsches Feld (error o.ä.). Im View renderst du den Wert auf dem Formular als Attribut:

<form data-has-error="{{form.error}}" ...>

Dann inkludierst du noch ein Skript (JS), welches im Fall, dass es einen Fehler gab, zu dem Element scrollt:

const target = document.querySelector("[data-has-error='True']");

if (target) {
  target.scrollIntoView();
}

2) Kann es sein, dass dein gesamter Redirect unnötig ist, da du eh nur wieder auf dieselbe Seite (index) mit dem selben Formular verweist?

Wie im obigen Fall brauchst du dann eigentlich nur dein Formularobjekt erweitern (diesmal um eine success_message) und das Template:

{% if form.success_message != None %}
  <p class="success">{{ form.success_message }}</p>
{% endif %}

Der Aufruf der redirect-Methode sowie die success-Funktion fliegen hingegen raus.