Comment puis-je activer la validation jQuery sur les champs en lecture seule?

Les gars de http://jqueryvalidation.org/ viennent de publier la version 1.13.1. En consultant leur site Web, je vois ceci sur le changelog:

CORE: * Ignorer les champs en lecture seule et désactivée. (9f4ba10)

C’est le lien: https://github.com/jzaefferer/jquery-validation/commit/9f4ba10ea79b4cf59225468d6ec29911f0e53a0a

J’utilise des modèles d’amorçage et l’un d’entre eux utilise maintenant cette version. Cela me pose un problème, j’utilise l’atsortingbut readonly pour empêcher les utilisateurs de saisir les dates manuellement, leur seule option est donc de choisir une date dans le sélecteur de date.

Avec cette modification, le plug-in de validation ignore les entrées en lecture seule marquées comme étant obligatoires. Quelqu’un peut-il m’aider à suggérer une solution pour la version 1.13.1 ou les versions futures? J’ai trouvé une question pour faire le contraire: comment puis-je désactiver la validation JQuery sur les champs en lecture seule?

Merci pour votre suggestion Panoptik, l’ajout en readonly sur focusin , puis sa suppression sur focusout était la méthode la plus propre, des millions de mercis! Je me réponds au cas où quelqu’un aurait le même problème. J’espère que ça aide.

 $(document).on("focusin", "#someid", function() { $(this).prop('readonly', true); }); $(document).on("focusout", "#someid", function() { $(this).prop('readonly', false); });

Vous pouvez remplacer la fonction “éléments” d’origine par une implémentation qui est assez similaire à l’implémentation d’origine à l’exception du traitement en lecture seule du champ. Ce n’est pas une solution élégante, mais cela fonctionne. Si vous mettez à jour votre bibliothèque de validation jQuery, vous devez également revérifier votre méthode remplacée.
* UpToDate * Voir jquery-validate-1.14 changeLog : Rétablir “Ignorer les champs en lecture seule ainsi que les champs désactivés.” 🙂 🙂

 $.validator.prototype.elements = function() { var validator = this, rulesCache = {}; return $( this.currentForm ) .find( "input, select, textarea" ) .not( ":submit, :reset, :image, [disabled]") // changed from: .not( ":submit, :reset, :image, [disabled], [readonly]" ) .not( this.settings.ignore ) .filter( function() { if ( !this.name && validator.settings.debug && window.console ) { console.error( "%o has no name assigned", this ); } if ( this.name in rulesCache || !validator.objectLength( $( this ).rules() ) ) { return false; } rulesCache[ this.name ] = true; return true; }); };

Je n’ai pas aimé participer aux événements focusin / out. Vous devez également append un style CSS. Le code ci-dessous supprime l’atsortingbut readonly et le réapplique lorsque le formulaire n’est pas valide.

 $('#form').submit(function () { var children = $(this).find('input[readonly]'); children.prop('readonly', false); var validform = $(this).valid(); if (validform) { $(this).unbind('submit').submit(); } else { children.prop('readonly', true); } e.preventDefault(); e.stopPropagation(); })

La solution focusin à définir l’atsortingbut focusin événement focusin déclenché est bonne, mais requirejs des gestionnaires d’écriture dans le bloc (Pourquoi? Par exemple, Firefox ne prend pas en charge onfocusin attr pour les éléments d'entrée).

Donc, à mon avis, la solution simple et multiplate-forme est définie sur onkeydown="return false;" atsortingbuer comme:

Cela laisse l'élément éligible pour la validation et ne permet pas d'entrer quoi que ce soit dedans.