web-dev-qa-db-ja.com

jQuery Validationプラグイン-カスタムメッセージ

私はJQueryを初めて使用し、 JQuery検証プラグイン を使用しています。

デフォルトのメッセージをオーバーライドして、フォーム要素に関連付けられたラベルのテキストも表示する方法を尋ねたいと思います。

次のようなメッセージが表示されます。

フィールドのパスワードが必要です。デフォルトの代わりにこのフィールドは必須です

フィールドPostCodeには少なくとも3文字が含まれている必要があります。デフォルトの代わりに少なくとも3文字を入力してください。

検証のすべてのタイプの各アイテムにカスタムメッセージを指定したくないため、このプラグインのデフォルトの動作をオーバーライドする必要があります。

出来ますか?

31
Detonator
$("#signupform")
    .validate({
        rules: {
            password: "required",
            postcode: {
                required: true,
                minlength: 3
            }
        },
        messages: {
            password: "Field Password is required",
            postcode: {
                required: "Field PostCode is required",
                minlength: "Field PostCode must contain at least 3 characters" 
            }
    });
45
Shef

これは、数日前に同じものを探していたときに見つけたものです。残念ながら、どこで見つけたのか覚えていないので、回答のクレジットを書いた人にそれを渡すことはできません。

jQuery.extend(jQuery.validator.messages, {
    required:"This field is required.",
    equalTo:"Password fields do not match.",
    email:"Please enter a valid email.",
});
17
user828267

これを達成するためのより簡潔な方法があります。

定義済みルールまたはカスタムルールのデフォルトエラーメッセージを上書きするには、「data-msg」または「data-msg-(rulename)」を使用します。 (jQuery検証v1.11.0以降、現在v1.16.0)

<input id="pwd" name="pwd" type="password" value=""
       required
       data-msg-required="Field Password is required." />

<input id="postcode" name="postcode" type="text" value=""
       required
       data-msg-required="Field PostCode is required."
       minlength="3"
       data-msg-minlength="Field PostCode must contain at least 3 characters." />
8
detale

同じことをする必要があり、そのメッセージを複数のフォームで共有できるようにカスタムメソッドを作成することになりました。

この回答は、同様のスタックオーバーフローの質問で見つかりました: jquery検証プラグインのルールをクラスごとに指定するにはどうすればよいですか?

$.validator.addMethod(
    "newEmail", //name of a virtual validator
    $.validator.methods.email, //use the actual email validator
    "Custom error message"
);
4
Bill Keller

プラグインの後にこれを追加します。

jQuery.extend(jQuery.validator.messages, {
    required: "Your new default message",
    email: "That's not a valid email"
});

必要に応じて別のファイルに置くことができますが、プラグイン自体の後に含まれていることを確認してください

1
Bojan Srbinoski