入力フォームが長かった場合、幾つかのステップに分割することがあります。そうした時、都度サーバに飛ばす方式が選ばれることが多いですが、その度にデータの送信とレンダリングが行われて面倒です。 そこで使ってみたいのがMulti-Step-Form-Jsです。jQueryでフォームをマルチステップに変換してくれます。

Multi-Step-Form-Jsの使い方

デモの場合、3ステップになっています。

バリデーション機能もあります。

二番目のステップに進みました。

最後のステップになっています。

Multi-Step-Form-Jsは一つのフォームを複数のステップに変換しています。つまりサーバ側に送られるのは一度だけです。確認画面がないのが残念ですが、その部分はカスタマイズしても良さそうです。

Multi-Step-Form-JsはjQuery/JavaScript製のオープンソース・ソフトウェア（MIT License）です。

Multi Step Form Js Demo - JSFiddle mgildea/Multi-Step-Form-Js: Multi Step Form with jQuery validation