Comment ajouter une classe
Résolu
DADYY87
-
DADYY87 -
DADYY87 -
Bonjour,
J'essaie de rajouter une classe à partir d'un each pour que le nom de la classe soit modifié à chaque fois qu'on rajoute une ligne et donc que ce ne soit pas le même nom après chaque ajout de ligne.
Voici mon code :
La ligne se rajoute bien par contre pour la partie addClass aucune action ne s'effectue je ne comprends pas pourquoi...
Je suis pas très fort en js j'espère que quelqu'un pourra m'aider.
J'essaie de rajouter une classe à partir d'un each pour que le nom de la classe soit modifié à chaque fois qu'on rajoute une ligne et donc que ce ne soit pas le même nom après chaque ajout de ligne.
Voici mon code :
$(".btn-new").on('click', function (){
var i = 0;
$(".btn-new").each(function (){
$("#uploader2").append('<div class="row uploadDoc"><div class="col-sm-4 order-1 order-sm-0"><div class="docErr">Veillez upload au format pdf, jpg, jpeg, png</div><!--error--><div class="fileUpload btn btn-orange"> <img src="https://image.flaticon.com/icons/svg/136/136549.svg" class="icon2"><span class="upl" id="upload">Parcourir</span><input type="file" name="file[]" class="upload up" accept="image/png, image/jpeg, .pdf" id="up" onchange="readURL(this);" required/><div class="invalid-feedback">Document obligatoire</div></div></div><div class="col-sm-1 order-2 order-sm-1"><div class="pos_croix"><a href="#" id="add-class"><i class="fas fa-times fa-xs" style="color:red;"></i></a></div></div><div class="col-sm-6 order-0 order-sm-2"><input type="text" class="form-control" name="test[]" placeholder="Veuillez preciser le document que vous ajoutez" required pattern="^[A-Za-z -]+$"><div class="invalid-feedback">Veuillez saisir le document que vous souhaitez ajouter.</div></div></div>');
document.getElementById('add-class').addClass('test'.i);
i++;
});
$(document).on("click", "a.test2", function (){
$(this).closest(".uploadDoc").remove();
});
});
La ligne se rajoute bien par contre pour la partie addClass aucune action ne s'effectue je ne comprends pas pourquoi...
Je suis pas très fort en js j'espère que quelqu'un pourra m'aider.
A voir également:
- Comment ajouter une classe
- Comment ajouter une signature sur word - Guide
- Ajouter une liste déroulante excel - Guide
- Ajouter un profil netflix payant - Accueil - Guide streaming
- Comment ajouter un compte facebook - Guide
- Ajouter une application au démarrage - Guide
3 réponses
Bonjour Jordane45,
Je m'en suis rendu compte quand j'ai fait d'autres testes.
Du coup mon code est le suivant :
J'ai réussi à nommer ma classe pour le premier mais pour le reste le nom est le même j'ai l'impression que ça n'incrémente pas correctement ...
Je m'en suis rendu compte quand j'ai fait d'autres testes.
Du coup mon code est le suivant :
var i = 1;
$(".btn-new").each(function (){
var name = 'test' + i;
$("#uploader2").append('<div class="row uploadDoc"><div class="col-sm-4 order-1 order-sm-0"><div class="docErr">Veillez upload au format pdf, jpg, jpeg, png</div><!--error--><div class="fileUpload btn btn-orange"> <img src="https://image.flaticon.com/icons/svg/136/136549.svg" class="icon2"><span class="upl" id="upload">Parcourir</span><input type="file" name="file[]" class="upload up" accept="image/png, image/jpeg, .pdf" id="up" onchange="readURL(this);" required/><div class="invalid-feedback">Document obligatoire</div></div></div><div class="col-sm-1 order-2 order-sm-1"><div class="pos_croix"><a href="#" id="add-class" class='+name+'><i class="fas fa-times fa-xs" style="color:red;"></i></a></div></div><div class="col-sm-6 order-0 order-sm-2"><input type="text" class="form-control" name="test[]" placeholder="Veuillez preciser le document que vous ajoutez" required pattern="^[A-Za-z -]+$"><div class="invalid-feedback">Veuillez saisir le document que vous souhaitez ajouter.</div></div></div>');
i++;
});
J'ai réussi à nommer ma classe pour le premier mais pour le reste le nom est le même j'ai l'impression que ça n'incrémente pas correctement ...
J'ai du coup modifié en mettant en dehors le "var i". Et cette fois-ci ça fonctionne !
Voici le code :
merci pour votre aide ^^
Voici le code :
var i = 0;
$("#change-class").each(function (){
i++;
});
var name = 'eff' + i;
$("#uploader2").append('<div class="row uploadDoc"><div class="col-sm-4 order-1 order-sm-0"><div class="docErr">Veillez upload au format pdf, jpg, jpeg, png</div><!--error--><div class="fileUpload btn btn-orange"> <img src="https://image.flaticon.com/icons/svg/136/136549.svg" class="icon2"><span class="upl" id="upload">Parcourir</span><input type="file" name="file[]" class="upload up" accept="image/png, image/jpeg, .pdf" id="up" onchange="readURL(this);" required/><div class="invalid-feedback">Document obligatoire</div></div></div><div class="col-sm-1 order-2 order-sm-1"><div class="pos_croix"><a href="#" id="change-class" class="' + name +'"><i class="fas fa-times fa-xs" style="color:red;"></i></a></div></div><div class="col-sm-6 order-0 order-sm-2"><input type="text" class="form-control" name="test[]" placeholder="Veuillez preciser le document que vous ajoutez" required pattern="^[A-Za-z -]+$"><div class="invalid-feedback">Veuillez saisir le document que vous souhaitez ajouter.</div></div></div>');
merci pour votre aide ^^