validate.js 初期状態で「この項目は必須です」のエラーを表示しない

JavaScript

screenshot

は、フォームを表示した時点で「必ず入力してください」というエラーが表示される。必須項目を示すのに効果的だけれど、個人的には初期状態でエラーメッセージを見せたくないと思った。

screenshot

Remember The Milkの登録フォームは初期状態でバリデーションエラーを表示しない。この動作が理想。


以下のようにして回避した。

function switch_first(f1, f2) {
    var is_first = true;
    return function(e) {
        if (is_first) {
            is_first = false;
            return (typeof(f1)=='function') ? f1(e) : f1;
        } else {
            return (typeof(f2)=='function') ? f2(e) : f2;
        }
    };
}

Validator.register({
    "#fname" : {
        "/^.{3,}$/": "OK",
        "/^$/": switch_first("*", "必ず入力してください"),
        "/.*/": "3文字以上入力してください"
    },
});

switch_firstは、最初のバリデーションと2回目以降のバリデーションで表示を切り替える関数を返す。

初期状態では「*」が表示され、1度フィールドに変更を加えたりフォーカスが合うと、空の値に対して「必ず入力してください」というメッセージが表示されるようになる。