フォーム入力チェックJavaScriptライブラリ

TMT Validatorは、フォーム入力チェック用JavaScriptのライブラリです。
使い方は、外部JavaScriptファイルを一つ読み込み、後は各HTMLのタグ内にattribute等を書くだけです。ちなみにJSファイルはダウンロードしたZIPの中の”script_tmt_validator.js”という600行弱のファイルです。
サンプルはTMT Validator – Validation samplesにありますので、そちらで体験も出来ます。ちなみに、使ったときの挙動としては、普通のチェックスクリプトです。
使い方は詳しくはTMT Validator Syntax Referenceのページにあります。具体的には…

<form action=”index.htm” tmt:validate=”true” tmt:callback=”displayError”>
の様にformタグに書き加えます。tmt:validate=”true”で使用する状態になります。CallBackは、独自に関数を書いて、好みの処理をしたい場合に使います。以下のページに各formオブジェクトを取ってくる方法など書いてあるので、必要な方はこちらに。
　＃TMT Validator – Customizing errors notification
それぞれのinputタグには、同様に　tmt:pattern　等のattributeを追加してチェックのパターンを決めます。これは、submitをした時にアラートとして出るものです。例えば、tmt:pattern には、

• email
• lettersonly
• alphanumeric
• integer
• positiveinteger
• number

といったパターンが用意されてます。他にもファイルアップロード用にもいくつかデフォルトで用意されてます。日本語には対応していませんが…。
また、tmt:filters　というattributeにて、入力禁止文字を指定できます。デフォルトで以下のものが用意されています。

• ltrim
• rtrim
• nospaces
• nocommas
• nodots
• noquotes
• nodoublequotes
• nohtml
• alphanumericonly
• numbersonly
• lettersonly
• commastodots
• dotstocommas
• numberscommas
• numbersdots

これは先ほどのtmt:pattern　とどう違うかというと、サンプルをいじってもらうと分かりやすいかと思いますが、入力禁止文字を入れると、リアルタイムに消去されます。
数字しか入れてはいけないフィールドにアルファベットを連打すると、どんどん勝手に消えていきます。
注釈をつけておかないと、キーボードが壊れたんじゃないかと、などと思われる恐れがあるので、目立つ形で注釈をつける必要があると思いますが、これは有用な予感が。
できれば勝手に消す前にalertを一発出した方が、使用者にとっては分かりやすいと思います。
こんな感じで他にもcheckbox用のものやselect用のものや色々と用意されているので、フォームの入力チェックが面倒くさくなったら、これで済ませてしまうのも良いかと思います。DreamWeaverとかFrontPageとかでも簡単につけられると言えばそれまでですが(‘A`)
実は一番感銘を受けたのは、submit後の入力チェックではねられると、inValidな部分のフィールドの背景が黄色になることだったりします。これは間違った場所が分かりやすくてよさげ。