Webフォームから飛んできた値について、入力チェックを行わないということはまずないだろう。数字のところに文字列が入ったり、必須のものが入っていなかったりすることはよくある。だからこそサーバサイドのプログラムでチェックはするのだが、ユーザビリティを考えるとクライアントサイドでも入力チェックを行いたい。

リアルタイムで行われる入力チェック

入力チェックのJavaScriptを作る、なんていうと面倒な感じがするがVanadiumを使えば開発者の方でなくともチェック機能が実装できてしまう。

今回紹介するオープンソース・ソフトウェアはVanadium、jQueryを使ったクライアントサイド入力チェックライブラリだ。

Vanadiumは入力項目のクラスでチェック内容を指定するようになっている。そのためVanadiumさえ読み込めば、HTMLを変更するだけで入力チェックが実装できるようになる。入力必須や正規表現を使った入力フォーマット指定、数値（整数またはfloat）、最大/最小文字数、入力範囲、規約同意、パスワード（入力確認との一致）、メールアドレスなど。

入力が正しいと色を変えることができる

さらに入力チェックをJSONで一括指定したり、ユーザ名のようにユニークである必要があるものについてはAjaxを使ってデータを取ることも可能だ。エラーチェックは入力時にリアルタイムに行うのはもちろん、入力が外れた時に実行したり、送信時にのみチェックする指定も可能になっている。

入力チェックがデザイナの方であっても作れてしまうというのは簡単で良い。もちろんサーバサイドでのエラーチェックは欠かせないが、それでもユーザにストレスを感じさせない作りにできそうだ。入力項目が多い画面などで積極的に使いたいライブラリだ。

VanadiumJS

　http://vanadiumjs.com/