102 votes

jQuery.Validate.unobtrusive ne fonctionne ne pas avec des éléments dynamiques injectées

Je suis en train de travailler avec ASP.Net MVC3, de la façon la plus facile d'utiliser la validation du client serait l'activation de l' jquery.validate.unobtrusive. Tout fonctionne bien, des trucs qui ont le droit de serveur.

Mais quand j'essaie d'injecter de nouveaux "facteurs de production" avec le javascript, et je savais que je dois appeler $.validator.unobtrusive.parse() de relier les validations. Mais toujours, tous ces dynamiques injecté champs ne sont pas en fonctionnement.

Pire encore, j'essaie de lier manuellement à l'aide de jquery.validate et il ne fonctionne pas non plus. Toutes les pensées?

169voto

viggity Points 5342

J'ai essayé Xhalent de l'approche, mais malheureusement ça ne marchait pas pour moi. Robin approche ne fonctionne et ne fonctionne pas. Il a travaillé beaucoup pour ajouter dynamiquement des éléments, mais si vous avez essayé d'utiliser JQuery pour supprimer tous les attributs de validation et s'étend de la DOM, la validation de la bibliothèque cherchent encore à valider.

Toutefois, si vous supprimez la forme du "unobtrusiveValidation de données" en plus de "validationData", il a travaillé comme un charme dynamique de l'ajout et la suppression d'éléments que vous souhaitez validé ou non validé.

$("form").removeData("validator");
$("form").removeData("unobtrusiveValidation");
$.validator.unobtrusive.parse("form");

65voto

Xhalent Points 3038

J’ai créé une extension pour la bibliothèque de jquery.validate.unobtrusive qui a résolu ce problème pour ma situation - il pourrait être intéressant.

http://xhalent.wordpress.com/2011/01/24/Applying-unobtrusive-validation-to-Dynamic-Content/

45voto

lambinator Points 2876

J’aime réellement vraiment la simplicité de la solution @viggity et @Robins, alors j’ai transformé en un petit plugin rapide :

Exemple d’utilisation :

34voto

Je vais avoir le même problème. J'ai découvert il n'est pas possible d'appeler $.programme de validation.discrète.parse() sur le même formulaire deux fois. Lors du chargement du formulaire d'abord à partir du serveur le formulaire est automatiquement analysé par le discret de la bibliothèque. Lorsque vous ajoutez un élément d'entrée de façon dynamique à la forme et à l'appel de $.programme de validation.discrète.parse() de nouveau, il ne fonctionnera pas. Il en va de même pour parseElement().

La discrète lib appelle la méthode de validation de l'jquery valider plugin afin de définir toutes les règles et les messages. Le problème est, quand on l'appelle à nouveau, le plugin n'a pas de mise à jour de la nouvelle série de règles de son.

J'en ai trouvé un brut solution: Avant d'appeler la méthode d'analyse sur le non-intrusif lib, j'ai jeter le validateur de formulaire:

$('yourForm').removeData("validator");

Maintenant, lors de la validation de la méthode est appelée par le discret lib, toutes les règles et tous les messages sont recréés, y compris la dynamique ajouté entrées.

Espérons que cette aide

10voto

Sundara Prabu Points 244

Je suis en utilisant MVC 4 et JQuery 1.8, ressemble le morceau de code suivant est nécessaire pour permettre à Jquery de validation dynamiquement injecté contenu via Ajax ou Jquery dans les DOM.

J'ai fait à une fonction modulaire qui accepte l'objet Jquery du nouvel élément ajouté

disons que vous avez cloné une nouvelle table avec l'id tblContacts à l'aide de Jquery sur le clic d'un bouton, puis d'inclure le ci-dessous en fonction de votre fichier js et l'appeler comme

fnValidateDynamicContent("#tblContacts")


function fnValidateDynamicContent(element)
{
var currForm = element.closest("form");
currForm.removeData("validator");
currForm.removeData("unobtrusiveValidation");
$.validator.unobtrusive.parse(currForm);
currForm.validate(); // This line is important and added for client side validation to trigger, without this it didn't fire client side errors.
}

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X