Wie style ich meine benötigten Formularfelder?

Ich habe ein Formular auf meiner Seite und mit der jQuery Validierung Plugin von http://jqueryvalidation.org zeigt es Fehler unter den Formularfeldern, wenn sie nicht geliefert werden.Wie style ich meine benötigten Formularfelder?

Was ich frage mich ist, wie ich diese Fehler stylen kann? Ich möchte im Grunde, dass der Fehler innerhalb des eigentlichen Feldes selbst und der Text eine bestimmte Farbe zeigt. Wie kann ich das machen?

Hier ist meine Webseite http://geofilterme.com/makemeone/

<form id="form" class="topBefore" method="post" action="thankyou.php"> 
     <input id="name" type="text" name="sender" placeholder="Name" required=""> 
      <input id="email" type="email" name="senderEmail" placeholder="E-mail" required=""> 
     <input id="snapchat" type="text" name="snapchat" placeholder="Snapchat username"> 
     <input id="reach" type="text" name="reach" placeholder="Estimated reach (number of people)" required=""> 
      <textarea id="message" type="text" name="message" placeholder="Describe what you want on the geofilter, and what it&#8217s for:" required=""></textarea> 
     <input id="submit" type="submit" name="submit" value="SUBMIT"> 
    </form>

Quelle

2016-04-10 O. Eliel

Stil mit CSS. Position wird in der Jquery sein –

Ich bin mir nicht sicher, wo ich die Position finde. Und was nenne ich im CSS? –

Jedes Ihrer Elemente hat eine ID. Dadurch können Sie sie individuell gestalten. Zum Beispiel: '#name {width: 100px; } '. Wenn Sie mehrere Elemente stylen möchten, verwenden Sie für jedes Element den gleichen Klassennamen: 'class =" form_input_fields "' und dann css, um alle zu formatieren: '.form_input_fields {width: 100px; } ' – icecub

Zuerst Sie Javascript Validate Datei gesucht haben muss, nach innen in irgendeiner Zeile Code es Ihnen, welche Klasse für alle Fehlerelemente verwenden erzählt und schafft eine spezifische ID für jedes Element, das die Validierung mit der von Ihnen angegebenen ID verwendet.

z. Wenn Sie Ihrem Element eine ID von 'E-Mail' gegeben haben, wird es das übernehmen und ein Label-Element erstellen, das den Fehler mit der ID 'E-Mail-Fehler' enthält.

Das Stück Code, das in jquery.validate.js tut, dass dies

// Create error element 
error = $("<" + this.settings.errorElement + ">") 
    .attr("id", elementID + "-error") 
    .addClass(this.settings.errorClass) 
    .html(message || "");

in Ihrem Fall also die einzelnen IDs und Klasse für Fehler ist:

ID: E-Mail-Fehler, Reach-Fehler, Nachricht-Fehler

Klasse: Fehler

Oder Sie können mit einigen Tools anschauen, die helfen können Sie wie Firebug, Browser-Entwickler-Tools e.t.c.

Bevor Sie fragen, suchen Sie zuerst ein wenig mehr von sich.

Quelle

2016-04-10 22:46:07

Danke aber ich kann nicht herausfinden, wie man die Fehlermeldung innerhalb des tatsächlichen Feldes hinzufügt? Ich möchte, dass es nach den Labels "Name", "Email" usw. kommt. –

Es gibt eine Menge Optionen in der jquery.validate-Dokumentation, um das zu versuchen. Wir geben dir die ersten Schritte. Suche einfach. Erwarte nicht die Antwort auf deine Hände, wenn du vorher noch nichts versucht hast. –

Wie style ich meine benötigten Formularfelder?

Antwort

Verwandte Themen