jQuery Form Wizard

Web-Formulare können einfach sein, aber auch ganz schön komplex werden. Besonders eklig können diejenigen werden, die auf mehrere Seiten aufgeteilt werden müssen. Die Gründe hierfür sind vielfältig, aber in der Regel sollen sie die Anzahl der ausgefüllten Formulare erhöhen. Der User füllt lieber viele kleine Formulare aus, als ein riesiges, dass kein Ende nimmt. Ausserdem können die einzelnen Seiten logisch zusammengefasst werden.

Was sich einfach anhört erzeugt primär eins für den Web-Entwickler: Arbeit. Dann anstatt ein Formular auszufüllen und die Daten nach dem Absenden zu verarbeiten hat man auf einmal ein Session-Management am Hals, da man sich die Daten der einzelnen Formulare merken muss, und diese erst dann verarbeiten kann, wenn wirklich alle Seiten korrekt ausgefüllt sind.

Screenshot des jQuery Webform Wizards

Besonders eklig wird die Angelegenheit, wenn man das Formular nachträglich ändern soll. Lustigerweise habe ich ein jQuery Plugin gefunden, dass einem die gesamte Arbeit abnimmt. Man kann damit problemlos ein Formular auf mehrere Seiten aufteilen, erhält aber am Ende trotzdem nur einen einzigen Post mit allen Daten auf einmal – und dafür braucht das knapp 3kb große Skript noch nicht einmal Cookies oder eine Session.

Der Trick ist ebenso einfach wie genial (und mal wieder eine der Sachen, wo man sich fragt, wieso man nicht selbst drauf gekommen ist). Das Plugin bedient sich der Möglichkeit ein Formular durch Fieldsets in Bereiche aufzuteilen. Das Plugin macht nichts anderes als aus den einzelnen Fieldsets eigene Seiten zu generieren. Darüber hinaus stellt es über die Seiten eine nette Navigation mit den abzuarbeitenden Schritten, und unter das Formular zwei Vor/Zurück-Buttons.

Alles in allem eine super Möglichkeit um einfach und schnell komplexe Formulare in handhabbare kleine Blöcke zu zerlegen. Der dabei entstandene Konstrukt wird vom Programmierer Wizard genannt – das halte ich zwar für etwas übertrieben, tut dem Nutzen aber keinen Abbruch. Das Plugin ist eine feine Möglichkeit ein Formular zu beeinflussen ohne den dahinter liegenden Code ändern zu müssen.

Ähnliche Beiträge

Mit Pow.js Sonnenstrahlen generieren Einen Hintergrund aus Sonnenstrahlen ist eine feine Sache, aber faktisch nicht implementierbar. Die Grafik die dafür notwendig wäre, wäre eindeutig zu...
jCookies – Cookies mit jQuery Cookies sind eine sinnvolle Sache, meistens mit dem Holzhammer verwendet. In der Regel werden sie entweder benutzt um eine Session in PHP zu kennzeich...
Lint für jQuery Früher war alles besser, der Himmel war blauer, die Wiesen grüner und ich programmierte eine Mailbox-Software in Turbo Pascal und wurde in der Uni daz...
Tutorial zur Passwortstärke mit jQuery Der Fall YouPorn hat eindrucksvoll bewiesen, wie simpel Passwörter sind. An der Uni habe ich in einem Kurs echt wilde Dinge gelernt um Systeme zu bela...

Schreibe einen Kommentar