jquery-validationで空白のみ入力も未入力とみなすカスタムメソッド作成

jquery-validationのrequiredでは空白のみ入力が許容される

ある必須入力テキストエリアの入力チェックとして

aaa.js

// コメント必須チェック設定
$('#xxxxForm').validate({
    errorClass: 'input-validation-error',
    rules: {
        xxxComment: {
            required: true
        }
    },
    messages: {
        xxxComment: {
            required: "コメントは必ず入力してください。"
        }
    }
});

のようにrequired指定しただけでは、空白のみの入力はチェックにかからない。

空白のみ入力も未入力とみなすカスタムメソッド作成

空白のみの入力も未入力とみなすようにトリム後の文字数をチェックするjQuery.validatorのカスタムメソッドを定義、
requiredと合わせて指定するようにして対応。

xxxxcommon.js

// jQuery.validatorのrequiredは空白のみを弾かないので対策用カスタムメソッドを定義
jQuery.validator.addMethod(
    "SpaceOnlyNg",
    function (val, elem) {
        return this.optional(elem) || val.trim().length > 0;
    },
    "必須入力です。" // デフォルトメッセージ
);

aaa.js

// コメント必須チェック設定
$('#xxxxForm').validate({
    errorClass: 'input-validation-error',
    rules: {
        xxxComment: {
            required: true,
            SpaceOnlyNg: true
        }
    },
    messages: {
        xxxComment: {
            required: "コメントは必ず入力してください。",
            SpaceOnlyNg: "コメントは必ず入力してください。"
        }
    }
});

• addMethodは複数個所で使用できるように共通で読み込むjsに記述
• メッセージは呼び出しもとのmessagesで上書き指定可能