Tutorial für "Spry" Formularvalidierung

May 9

Web-Design-Software von Adobe Dreamweaver kann Webentwickler Überprüfung-Textfeld Spry-Widgets verwenden, um Formulare erstellen, die aktualisierten Informationen auf, ob die Eingabe des Benutzers gegeben von den Entwicklern Überprüfungskriterien erfüllt anzeigen. Das Spry-Widget zeigt auch spezifische Fehlermeldungen zu den Grund warum die Eingabe fehlgeschlagen ist, z. B. ein ungültiges Format oder einer leeren Pflichtfeld zu überprüfen. Sie können die "Spry" CSS-Datei ändern die Darstellung der Fehlermeldungen und Staaten bearbeiten.

Anweisungen

1 Hinzuzufügen Sie ein Link zu der Spry-JavaScript-Bibliothek und die CSS-Datei im Abschnitt zwischen der "< Head >"-Tags am Anfang der HTML-Seite mit dem Formular:

< Skript-Typ = "Text/Javascript" >< / script >

< href="SpryAssets/SpryValidationTextField.css link" Rel = "Stylesheet" Type = "Text/Css" / >

2 Bestimmen Sie, welcher der Spry-Formular Validierung Staaten Ihre Formularfelder zuweisen. Eingaben sind in den "Ausgangszustand" Wenn die Seite zuerst beginnt, und Übergang zu den "Fokuszustand" Wenn der Benutzer klickt oder verschiebt es. Spry enthält auch Zustände für wenn das Form-Element keine minimale oder maximale Anzahl von Zeichen, erfüllt wenn es nicht erforderliche Daten enthält, wenn die Daten ein ungültiges Format hat oder wenn der Benutzer kein erforderlich Kontrollkästchen oder Optionsfeld auswählt.

3 Schließen Sie die Formulareingabe in "< Span >" Tags, die die Spry-Einstellungen gelten für diese Eingabe:

< span-Element-Id = "sprytextfield1" >... < / span >

4 Fügen Sie einen Span-Tag-Satz direkt nach die Zeile im HTML-Formular Eingabe, welche Staatsform Spry Fehler Nachricht anzugeben. Um erfordern eine Eingabe für ein Textfeld hinzufügen "< span Class ="TextfieldRequiredMsg"> ist ein Wert erforderlich. < / span >." Sie können den Text zwischen den Span-Tags beliebiger Text ändern, die Sie möchten. Ein Beispiel für ein Kontrollkästchen erforderlich ist "< span Class ="CheckboxRequiredMsg"> Überprüfen Sie mindestens ein Feld. < / span >."

5 Initialisieren Sie das Validierung Spry-Widget nach dem schließenden HTML-Formular-Tag durch Hinzufügen des JavaScript-Aufrufs an die Widget-Felder, ersetzen "sprytextfield1" mit dem Namen in der ersten Span-Tags, die das gesamte Formular Eingabe eingeschlossen verwendet:

< Skript-Typ = "Text/Javascript" >

Var sprytextfield1 = new Spry.Widget.ValidationTextField("sprytextfield1");

< / script >


SIE KÖNNEN AUCH GERNE