Contao-Camp 2024
Ergebnis 1 bis 6 von 6

Thema: Kontaktformular, Error-Meldungen verschieben Design

  1. #1
    Contao-Fan
    Registriert seit
    31.01.2016.
    Ort
    Kaufbeuren
    Beiträge
    473

    Standard Kontaktformular, Error-Meldungen verschieben Design

    Hallo zusammen,

    ich habe ein Kontaktformular aufgebaut, welches auch einwandfrei funktioniert und konnte für das nachfolgende Problem noch keine Lösung finden.
    Dieses Formular hat ein zweireihiges Design, links sind die Pflichtfelder und rechts ohne Pflichtfelder. Wenn nun eine Fehleingabe getätigt oder ein Pflichtfeld nicht ausgefüllt wurde erscheint ja beim jeweiligen Feld eine Fehlermeldung, was auch soweit richtig dargestellt wird. Nur auf der rechten Seite ist nun das Eingabefeld verschoben, es ist dann auf der gleichen Höhe wie die Fehlermeldung vom betreffenden Eingabefeld links. Gibt es dafür eine Möglichkeit oder Methode vielleicht per CSS das Feld ohne der Pflichteingabe um die Höhe der Fehlermeldung nach unten zu verschieben? Hat jemand einen guten Tipp wie man dies lösen könnte. Könnte man z.B. eine CSS-Klasse mit einer anderen CSS-Klasse um einen Style zu erweitern?
    Danke!


    Gruß
    Thomas
    Geändert von Thomasge (23.08.2020 um 19:10 Uhr)

  2. #2
    Contao-Urgestein Avatar von folkfreund
    Registriert seit
    09.04.2010.
    Beiträge
    1.928

    Standard

    Hallo Thomas,
    das ist sicher einfach eine 'Aufgabe' für CSS. Mit großer Wahrscheinlichkeit musst du keine Klasse hinzufügen.
    Kannst du einen Link zu dem Formular posten, damit man das auf deiner Seite mal ausprobieren kann?

    Gruß, folkfreund

  3. #3
    Contao-Fan
    Registriert seit
    31.01.2016.
    Ort
    Kaufbeuren
    Beiträge
    473

    Standard

    Danke für die Rückmeldung.
    Anbei der Link zu der betreffenden Seite http://sub.musikverein-hirschzell.de/kontakt.html. Die Seite ist derzeit noch im Aufbau und deshalb auch nicht ganz fertig.

    Gruß
    Thomas

  4. #4
    AG Pressearbeit
    Community-Moderator
    Buchautor 'Contao für Webdesigner'
    Avatar von planepix
    Registriert seit
    05.06.2009.
    Ort
    Stuttgart
    Beiträge
    6.464
    Partner-ID
    107
    Contao-Projekt unterstützen

    Support Contao

    Standard

    Hallo Thomas,

    vermutlich hast du die Option „HTML5-Validierung deaktivieren” aktiviert…?
    Dann werden die Fehler im Feld angezeigt bzw. in einem Overlay und dann verschiebt es nichts.
    ---------------------------------
    Beste Grüße planepix
    Contao für Webdesigner (Website), Twitter: @contaowebdesign
    weitzeldesign
    Contao-Sprechstunde
    Contao Schulungen: https://www.weitzeldesign.com/cms-co...chulungen.html
    Contao Jahrbuch: www.contao-jahrbuch.de
    Contao Agenturtag: www.contao-agenturtag.de
    Contao Stammtisch Stuttgart: www.contao-stammtisch-stuttgart.de
    Contao 4 Erfahrungen als Gitbook: https://app.gitbook.com/@planepix/s/...-mit-contao-4/
    Contao 4 & Manager Hosterhinweise: https://github.com/contao/contao-manager/wiki

    Schon wieder ein Update?
    Glücklich sind die, die den Wert erkennen – und wertschätzen.
    „Muss man machen wie beim Zahnarzt. Der bestraft einen auch mit hohen Rechnungen wenn man die Pflege vernachlässigt.”

  5. #5
    Community-Moderator
    Wandelndes Contao-Lexikon
    Avatar von Spooky
    Registriert seit
    12.04.2012.
    Ort
    Scotland
    Beiträge
    33.899
    Partner-ID
    10107

    Standard

    Trotz HTML5 Validierung kann es aber sein, dass ein Feld dann vom Server als nicht gültig erkannt wird - dann hat man das Problem wieder. Das CSS sollte man also auf jeden Fall so anpassen, dass die Fehlermeldungen vom Server richtig angezeigt werden.

  6. #6
    Contao-Fan
    Registriert seit
    31.01.2016.
    Ort
    Kaufbeuren
    Beiträge
    473

    Standard

    Danke für die Infos, aber ich glaube, dass es noch nicht ganz klar ist was ich eigentlich erreichen möchte.
    Zu meiner Seite: Dort gibt es z.B. im Kontaktformular links ein Eingabefeld als Pflichtfeld mit der Bezeichnung "Nachname" und rechts ein Feld das kein Pflichtfeld ist mit der Bezeichnung "Telefonnummer".
    Was soll geschehen: Wenn das Feld "Nachname" eine Fehlermeldung hat dann soll das Feld "Telefonnummer" ein margin-top:27px; erhalten und wenn das Feld "Nachname" keine Fehlermeldung hat dann soll das Feld "Telefonnummer" auch kein margin erhalten.
    Ist dies in irgendeiner Weise per CSS oder einer anderen Methode umzusetzen?

    Gruß
    Thomas

Aktive Benutzer

Aktive Benutzer

Aktive Benutzer in diesem Thema: 1 (Registrierte Benutzer: 0, Gäste: 1)

Lesezeichen

Lesezeichen

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •