入力された文字数を表示するためにjQuery validateでmaxlengthのエラーメッセージをカスタマイズする方法

Question

jQuery validateの maxlength 検証により、次のようなエラーメッセージが表示されるようにします。

＆quot; {0}文字以内で入力してください。現在、{1}文字を入力しました。＆quot;

{1} は実際の金額のプレースホルダーです。 これを行う最善の方法は何ですか？

Answer 1

これを行う簡単な方法はないと思いますが、回避策を見つけました。そのフィールドに対して独自のバリデーターを作成できると思いますが、これはもっと簡単かもしれません。

maxlength エラーのデフォルトメッセージを変更することから始めます：

$.extend($.validator.messages, {  
    maxlength: $.validator.format("Please enter no more than {0} characters. You've currently entered CHARS_NO characters.")
});

通常どおり検証を続けますが、この関数を追加します：

$('input').keyup(function () {
    var rules = $(this).rules();
    if (rules.maxlength !== undefined && !$(this).valid()) {
        var errorLabel = $('label[for=' + $(this).attr('id') + '][generated=true].error');
        errorLabel.text(errorLabel.text().replace('CHARS_NO', $(this).val().length));
        return false;
    }
});

こちらが実用的なデモです。

Answer 2

どのように検証をトリガーするのかわかりませんが、 input の maxlength 属性は、ユーザーがその値が示すものより多くの文字を入力できないようにします。そのため、 maxlength よりも多くの文字を入力したことをユーザーに通知する必要はありません。単純に入力できないからです。

追加のコンテキストや詳細を提供できますか？