web-dev-qa-db-fra.com

Dynamic jQuery Valider les messages d'erreur avec AddMethod en fonction de l'élément

Disons que j'ai un AddMethod personnalisé pour jQuery Valider comme:

$.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.');

Je ne peux pas trouver un moyen d'obtenir la variable element en question, et d'en obtenir des valeurs. Qu'est-ce que j'oublie ici?

javascriptjqueryvalidationjquery-validate
27
Mark Pieszak - Trilon.io

En regardant le code source du validateur, je pense que cela devrait le faire:

$.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.'
});

Dans votre code d'origine, la chaîne de message N'EST PAS dans la fermeture; la fermeture est le 2ème argument de addMethod, le message d'erreur est le 3ème argument.

65
Barmar

Tout d'abord, j'apprécie la réponse de Barmar.

Si vous pensez juste, vous pouvez utiliser n'importe quel message de validation jquery avec sa valeur param, vous pouvez appeler simplement les instances de message.

Voici le code

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

En validation jquery

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

Donc, si vous entrez quelque chose de moins de 1000. il vous enverra un message d'erreur, "Veuillez entrer une valeur supérieure à 1000 (le montant que vous avez mis dans la validation)". Cette méthode sera plus rapide si votre validation nécessite une modification de toute méthode actuelle ou vous le développez en plusieurs langues.

4
Rocker Maruf

J'ai trouvé ce semi par accident. Mes messages sont très dynamiques en fonction du résultat. donc juste avant d'appeler valider j'ajoute un attribut data-msg = "Mon message personnalisé" à l'élément. Le validateur reprendra cela:

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

trouvé des références de code sous customDataMessage dans jquery.validate.js

1
mmv_sat

Si la réponse de Barmar ne fonctionne pas pour vous, c'est probablement parce que vos paramètres pour l'élément contiennent déjà un message d'erreur (défini depuis le serveur dans asp.net MVC par exemple)

Ainsi, le code jQuery.validate ignorera le nouveau paramètre par défaut défini par le deuxième paramètre sur $ .validator.addMethod

Pour contourner ce problème, procédez comme suit:

$.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

tard pour la fête ici, mais cela semble fonctionner pour moi:

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));
});

où la valeur minDate a déjà été définie sur le contrôle pour valider quelque chose comme ceci:

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