フォームバリデータ jQuery Ketchup Plugin の使い方

ドキュメントがわりとわかりやすいです。

jQuery Ketchup Plugin 0.3.2 http://demos.usejquery.com/ketchup-plugin/index.html

簡単な使い方

基本的には jquery.ketchup.css と jquery.ketchup.all.min.js 読み込んで

$('#form_id').ketchup();

して

<input type="text" data-validate="validate(required)" />

みたいな感じでバリデーションしたいフォーム要素に data-validate 属性書けばいいだけだったので楽です。
このままだと英語でエラーメッセージ出てちょっとあれだし、ついてくる実装済みのバリデータだけだとちょっと物足りない感じなので

メッセージの変更

デフォルトだともともと用意されているバリデータのメッセージは英語です。メッセージを日本語に変更するには

$.ketchup.messages({
  required : 'この項目は必須です'
});
$('#form_id').ketchup();

バリデータの追加

ドキュメントや jquery.ketchup.validations.js を見て適切なバリデータがない場合は追加することができます。

$.ketchup.validation('hankaku', '半角英数字のみを入力してください', function(form, el, value) {
  return /^[a-zA-Z0-9]+$/.test(value);
});
$('#form_id').ketchup();

こんな感じです。

デフォルトはこんな感じ

見た目とかはCSSで変更することができます。

終わり

jQueryプラグインとかそうでないのとか、Javascriptのバリデータいくつかさわりましたけど、他のプラグインと衝突しまくる国産のやつとか、みんなあれで使えてるんでしょうかね。