jquery valider plugin sur une dynamique d'entrées d'un formulaire ne fonctionne pas
J'ai un formulaire où je vais avoir certains domaines, et ensuite, si nécessaire, l'utilisateur peut ajouter d'autres champs de même type. Im en utilisant http://jqueryvalidation.org/valider plugin pour valider les champs.
Comme je l'ai lu quelque part jquery valider plugin nécessite des noms uniques pour les champs pour valider. Je suis donc de nommer chaque domaine unique. D'abord j'espère que valider le plugin va prendre soin de l'ajouter dynamiquement des éléments de validation si j'ai ajouter des règles à l'aide de classes. Mais il s'avère qu'il ne l'est pas.
Donc, même si le nom de chaque champ est unique, valider plugin ne valide que la première entrée qui a été rendue au départ.
J'ai même essayé d'utiliser $.clone() dans l'espoir que ça va prendre soin de toutes les liaisons d'événements. Mais ça n'a pas fonctionné pour moi. J'ai donc déménagé à souligner répéter l'annotation comme il existe un certain nombre de domaines, et je ne veux pas écrire de modèles en JS et le nom en conséquence.
Je ne peux pas trouver une solution à cela et coincé ici. Peut pas plus sur jusqu'à ce que ce problème est résolu.
Voici JS que j'ai écrit.
$("#work_form").validate();
$(".work_emp_name").rules("add", {
required: true
});
_.templateSettings.variable = "element";
var tpl = _.template($("#form_tpl").html());
var counter = 1;
$("form").on("click", ".add_employer", function (e) {
e.preventDefault();
var tplData = {
i: counter
};
$("#word_exp_area").append(tpl(tplData));
counter += 1;
});
Vous trouverez les marques dans le violon configurer.
exemple de code et de mettre en place ici
il ne fonctionne pas.
il fonctionne bien sur la Première mais lorsque le nouvel employeur est ajouté et que vous l'enregistrez sans remplir le un autre employé, il enregistrer les données
veuillez consulter la réponse à ce que vous dites était le problème pour lequel j'avais besoin de la solution.
OriginalL'auteur SachinGutte | 2013-12-13
Vous devez vous connecter pour publier un commentaire.
Lorsque vous utilisez l'une des méthodes de ce plugin, comme
.rules()
, et en ciblant plus d'un élément, comme unclass
, vous devez également utiliser le jQuery.each()
méthode.Et vous ne pouvez pas utiliser
.rules()
sur des éléments qui n'existent pas encore dans les DOM. Il suffit de déplacer le.rules()
méthode à l'intérieur de la fonction qui crée de nouvelles entrées.De travail de DÉMONSTRATION: http://jsfiddle.net/Yy2gB/10/
Cependant, vous pouvez le rendre plus efficace en seulement cibler un nouveau champ, au lieu de tous les champs avec les
work_emp_name
class
.De travail de DÉMONSTRATION: http://jsfiddle.net/Yy2gB/11/
Mes deux exemples ci-dessus sont pour l'ajout de règles de créer dynamiquement des champs. Vous aurez toujours besoin de déclarer toutes les règles pour les champs statiques sur dom prêt comme suit...
data-rule-required="true"
dans le modèle lui-même. Cette force également les règles de validation sur les éléments dynamiques. Et je vais avoir plus de 8 champs qui se répète sur simple clic deAdd Employer
bouton ( désignation, le champ de travail, start & date de fin, les lettres de nomination et ainsi de suite). Donc, si je veux ajouter des règles à ces champs alors que j'aurais du écrire même code dansAdd Employer
cliquez sur l'auditeur. C'est beaucoup trop. Au lieu de cela, j'ai choisi de données des attributs de la méthode pour ajouter des règles de validation.Mais l'ajout de règles par le biais des données des attributs de ne pas donner plus de contrôle, comme si il y a des champs qui dépendent des valeurs des autres champs. Donc, votre réponse ne correspond à tous ces scénarios et donne plus de contrôle. C'est donc de manière correcte. Merci de prendre le temps de résoudre ce problème.
C'est peut-être vague question, mais n'est pas un plugin comme de valider doit prendre soin de l'ajouter dynamiquement des champs ou de l'ajout de règles avec des classes w/o à l'aide de
$.each
en premier lieu ? Maintenant, je sais que c'est écrit assez grand et a beaucoup d'options, mais je veux dire que ce sont des choses de base qu'un plugin devrait avoir.c'est à chaque développeur. Pour ce plugin, vous devez vous
.each()
.Pouvez-vous nous expliquer votre réponse à montrer comment une validation personnalisée message peut être réglé pour la dynamique de ces règles?
OriginalL'auteur
Renvoie les validations des règles pour le premier élément sélectionné ou
Ajoute aux règles établies et retourne toutes les règles pour la première appariés élément. Exige que le parent formulaire est validé, soit $( “form” ).valider() est appelée en premier ou
Supprime les règles spécifiées et retourne toutes les règles pour la première appariés élément.
plus d'infos
dans ce jsfiddle.net/Yy2gB/9 votre exemple, fondamentalement, vous n'avez même chose que ce que j'ai, seulement il ne fonctionne que sur de nouveaux éléments, et non pas sur celles existantes.
Mon contrôle. L'existant peut être déclarée lorsque la page est initialisé ou via inline HTML. Fixe ma réponse. Merci.
Ce qui m'a aidé a été
Requires that the parent form is validated...
Il est essentiel d'exécuter.validate()
sur la forme avant d'ajouter les règles, sinon ça ne marchera pas. Merci, @nznOriginalL'auteur
C'est parce que jQuery de Validation valide uniquement la première occurrence de la table actuellement.
Vous pouvez consulter mon s'engager sur le plugin que tout fonctionne correctement sur une occurrence du tableau.
OriginalL'auteur