de.hideout-lastation.com
Paradies Für Designer Und Entwickler


Validieren Sie Formulareingaben problemlos in jedem Browser mit Validatr

Der Umgang mit Formularen im Web kann sehr interessant sein. Sie können viele Anpassungen im Design, auf dem Etikett und sogar bei der Authentifizierung vornehmen. Mit vielen neuen Funktionen, die in HTML5 verfügbar sind, hat Jay Morrow Validatr erstellt, die sich auf die neuen HTML5-Eingabeattribute verlassen, um eine einfache und automatische Formularvalidierung durchzuführen.

Validatr ist ein browserübergreifendes kostenloses jQuery-Plugin. Wenn der Benutzer einen ungültigen Wert eingibt, wird der Formularrahmen automatisch rot umbrochen. Es kann auch viele Eingabe-Validierung wie E-Mail, Nummer, URL, Bereich, Farbeingaben und Datum .

Benutzerdefinierte Fehlermeldungen sind ebenfalls mit verschiedenen Optionen verfügbar, die HTML5-Datenattribute verwenden. Sie können das Element der Fehlermeldung mit Ihrem eigenen CSS anpassen, und das Plugin hat einige ziemlich gute CSS-Stile.

Grundlegende Anleitung

Um Validatr zu verwenden, fügen Sie das neueste jQuery und auch das Validatr-Skript in Ihr Projekt ein.

Dann rufe das Plugin mit folgendem Snippet auf:

Das Plugin erkennt das form, um Änderungen zu übernehmen.

HTML-Markup

Wie bereits erwähnt, verwendet Validatr das input zum Arbeiten. Das Element ist in das form Tag eingeschlossen. Das input behandelt alle verschiedenen Formulartypen und Einstellungen mit HTML5 data-attribute .

Wenn Sie beispielsweise ein Zahlenformular erstellen möchten, fügen Sie einfach type="number" in die input und einige zusätzliche Anforderungen ein, z. B. die Begrenzung der Mindest- und Höchstzahl. Wenn die Benutzer das Formular nicht leer lassen dürfen, fügen Sie einfach das required Attribut hinzu.

Das folgende ist ein grundlegendes Implementierungsbeispiel:

Das step wird für Wertinkremente verwendet, wenn der Benutzer im Formular auf den Pfeil zum Erhöhen oder Verringern klickt, beginnend innerhalb der definierten min oder 0. Wenn der Wert auf "0" gesetzt ist, wird Standardinkrement verwendet oder nur eins erhöht Punkt (der Wert muss eine positive Zahl sein).

Und hier ist das Ergebnis, wenn ein Benutzer einen ungültigen Wert oder eine Bereichsnummer eingibt. Unser Beispiel verwendet 2 für den step was bedeutet, dass beginnend mit 1 die einzigen Zahlen, die gültig sind, ein Inkrement von 2 haben, das heißt: 3, 5, 7 und so weiter. Der maximale Wert ist 11.

Eine vollständige Liste der anderen Eingabearten und der Attributdokumentation finden Sie auf der Validatr-Seite.

Das 12-Schritte-Programm zur persönlichen Produktivität

Das 12-Schritte-Programm zur persönlichen Produktivität

Der Ausdruck "12-Schritte-Programm" trägt die Konnotation der Sucht und wurde absichtlich im Titel dieses Beitrags verwendet. Sie sehen, um produktiv zu sein, müssen Sie süchtig nach Produktivität werden. Ob Sie es glauben oder nicht, die Entwicklung einer Abhängigkeit (Gewohnheit) kann schwieriger sein als die Überwindung einer .Bevor

(Tech- und Design-Tipps)

10 Cool Photoshop Tutorials zum Erstellen eines eigenen Cinemagraph

10 Cool Photoshop Tutorials zum Erstellen eines eigenen Cinemagraph

Cinemagraphs wurden ursprünglich von den amerikanischen Fotografen Kevin Burg und Jamie Beck von Ann Street Studio geprägt, die diesen Trick 2011 für ihre Nachrichten- und Modefotos verwendet haben. Es ist eine Art Hybrid zwischen einem Standbild und einem Video . Das ganze Bild bleibt still, bis auf eine bestimmte Bewegung, die sich immer wieder in nur einem Abschnitt wiederholt. D

(Tech- und Design-Tipps)