web-dev-qa-db-ja.com

動的jQuery要素に基づくAddMethodでエラーメッセージを検証します

次のようなjQuery ValidateのカスタムAddMethodがあるとします。

$.validator.addMethod('min-length', function (val, element) {
    // do stuff

// the error message here needs to be dynamic
}, 'The field cannot be less than than '
     + element.attr('data-min') + // it is within the closure, but it can't grab it
   ' length.');

問題のelement変数を取得し、そこから値を取得する方法がわかりません。ここで何が欠けていますか？

javascriptjqueryvalidationjquery-validate
27
Mark Pieszak - Trilon.io

バリデーターのソースコードを見ると、これでうまくいくと思います。

$.validator.addMethod('min-length', function (val, element) {
    return this.optional(element) || val.length >= $(element).data('min');
}, function(params, element) {
  return 'The field cannot be less than than ' + $(element).data('min') + ' length.'
});

元のコードでは、メッセージ文字列はクロージャ内にありません。クロージャーはaddMethodの2番目の引数であり、エラーメッセージは3番目の引数です。

65
Barmar

まず、Barmarの回答に感謝します。

考えてみると、jquery検証メッセージのいずれかとそのparam値を使用でき、単にメッセージインスタンスを呼び出すことができます。

ここにコードがあります

            jQuery.validator.addMethod("custom_min", function(value, element, param) {
                value = replaceAll(value, ',' , '');
                return this.optional( element ) || value >= param;
            },jQuery.validator.messages.min );

Jquery検証で

jQuery('#form_id').validate({
   rules: {
    'field_name': {
       required: true,
       number: true,
       custom_min: 1000
   }
});

したがって、1000未満の値を入力すると、「1000（検証に入力した量）より大きい値を入力してください」というエラーメッセージがスローされます。検証に現在のメソッドの変更が必要な場合、または複数の言語で開発しています。

4
Rocker Maruf

このセミを偶然見つけました。私のメッセージは結果に応じて非常に動的です。検証を呼び出す直前に、属性data-msg = "My custom message"を要素に追加します。バリデーターはそれを拾います：

err_msg = 'My custom message';
$('#my_element_id').attr('data-msg', err_msg);
$('#my_form_id').validate().element('input[name=\'my_element_name\'');

jquery.validate.jsのcustomDataMessageの下にいくつかのコード参照が見つかりました

1
mmv_sat

Barmarの答えがうまくいかない場合は、おそらく要素の設定にすでにエラーメッセージが含まれているためです（たとえば、asp.net MVCのサーバーから設定されます）

したがって、jQuery.validateコードは、$。validator.addMethodの2番目のパラメーターによって設定された新しいデフォルトを無視します

それを回避する方法は、次のことを行うことです。

$.validator.addMethod('min-length', function (val, element) {
   this.settings.messages[element.name]['min-length'] = function () { return 'put your custom message here'; };

   return this.optional(element) || val.length >= $(element).data('min');
});
0
Avi Pinto

ここのパーティーに遅れましたが、これは私のために働くようです：

jQuery.validator.addMethod("minDate", function(value, element, param) {
    var inputDate = new Date(value);
    return (inputDate >= param)
    }, function(param, element) {
        return 'Enter a date greater than or equal to ' + $.datepicker.formatDate("M d, yy", new Date(param));
});

ここで、このような何かを検証するために、コントロールにminDate値が以前に設定されています。

$('form:first').validate({
    rules: {
        "date-filed": {
            minDate: new Date(2000,0,0)
        },
...
0
Kyle