jQuery Girl
  1. jQuery Girl
  3. Validation d’amorçage lors de l’ajout dynamic de plusieurs champs
Intereting Posts
chrome / safari perd les coins arrondis lors d’une transition de diapositives jQuery Comment parsingr les balises HTML en texte brut Faire fondamentalement quelque chose de mal avec les appels de fonction. Les fonctions fonctionnent dans la console Requête JQuery Ajax POST au service Web distant Filtrer les éléments d’un object jQuery en fonction du contenu du texte Animation du chemin du clip suivant et précédent CSS Les espaces réservés disparaissent après l’échec de la validation à l’aide de jQuery Validate et de jQuery Placeholder Enhanced Comment naviguer en interne dans la même page en utilisant des liens en HTML5, JQuery mobile ..? Comment GitHub change l’URL sans recharger une page? trouver si un img a alt dans jquery sinon append dans un tableau Pourquoi jquery ne transforme-t-il pas mon tableau en chaîne json avant d’envoyer à la méthode Web asp.net? Cliquez sur l’événement et la valeur de l’option Chrome supprime l’élément de formulaire lors de l’utilisation de jQuery ajax Suppression de tout élément, réatsortingbution de la valeur de comptage Non autorisé à naviguer dans le cadre supérieur de l’URL de données: JsPDF

Validation d’amorçage lors de l’ajout dynamic de plusieurs champs

J’utilise bootstrap v3.1.1 et je veux valider un formulaire avec validation de bootstrap mais qui contient un bouton pour cloner 3 champs. Avec le clonage, tout fonctionne bien, mais je ne peux pas valider les champs clonés. Voici mon formulaire HTML: 

 
 
  
 
  
 
  
 
 add line

Dans le fichier JavaScript j’ai: 

  $(document).ready(function () { var count = 2; $('#cloneButton').click(function () { var klon = $('#line_1'); klon.clone().attr('id', 'line_' + (++count)).insertAfter($('#line_1')); $('#line_' + count).children('div').children('input').each(function () { $(this).val(''); var oldId = $(this).attr('id').split('_'); $(this).attr('id', oldId[0] + '_' + count); }); }); //For validating the fields: $('#myForm').bootstrapValidator({ fields: { 'firstField[]': { validators: { notEmpty: { message: 'Enter a value' } } }, 'secondField[]': { validators: { notEmpty: { message: 'Enter a value' } } }, 'thirdField[]': { validators: { notEmpty: { message: 'Enter a value' } } } } }); });

Je maintenant que je dois utiliser quelque chose comme ça 

 $('#myForm').bootstrapValidator('addField', klon.find('[name="firstField[]"]'));

pour chaque champ, mais je ne sais pas maintenant comment le faire correctement. Aidez-moi, s’il vous plaît. Merci!!

si vous insérez la méthode addField dans votre boucle de input , cela devrait fonctionner. Je suggère également d’enregistrer votre première row tant que modèle. 

 var template = $('#line_1').clone(); var options = { fields: { 'firstField[]': { validators: { notEmpty: { message: 'Enter a value 1' } } }, 'secondField[]': { validators: { notEmpty: { message: 'Enter a value 2' } } }, 'thirdField[]': { validators: { notEmpty: { message: 'Enter a value 3' } } } } }; $('#myForm').bootstrapValidator(options); $('#cloneButton').click(function () { var rowId = $('.row').length + 1; var validator = $('#myForm').data('bootstrapValidator'); var klon = template.clone(); klon.attr('id', 'line_' + rowId) .insertAfter($('.row').last()) .find('input') .each(function () { $(this).attr('id', $(this).attr('id').replace(/_(\d*)$/, "_"+rowId)); validator.addField($(this)); }) });

VIOLON

Cette réponse ne correspond pas exactement à cette question, mais si quelqu’un souhaite append un champ différent de manière dynamic, il peut l’utiliser. 

 $('#myForm').formValidation('addField', 'fourthField[]', { validators: { notEmpty: { message: 'Enter a value 4' } }, });

Syntaxe: $("#form_name").formValidation("addField",'no of the field',{validation});