Discussion :

[karpe]

Bonjour à tous,

J'essai d'afficher ou masquer un div selon son identifiant que je récupère via le selector.
Problème : au clic sur le bouton toutes les Divs se masquent au lieu de m’afficher celle que je souhaite.
je sèche, mes appels sont pourtant bien identifiés et les divs également ...

(je précise que je ne suis qu'un amateur, merci).
Quelqu'un voit-il le problème ?

categorie.js

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
 
lignes_AffSSCat += '<a type="button" class="DelSSC" onclick="AffConfSupp(ConfSousCat'+response.souscategories[i].souscategories_id +')" ><i class="glyphicon glyphicon-trash"></i></a>';
 
 
    					  lignes_AffSSCat += '<div id="ConfSousCat'+response.souscategories[i].souscategories_id +'" class="contentDiv" style="display: none;">';
    					  lignes_AffSSCat += '<div class="col-sm-5"></div>';
    					  lignes_AffSSCat += '<div class="col-sm-7"><p>Voulez-vous supprimer la catégorie ?</p></div>';
    					  lignes_AffSSCat += '</div>';

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
 
 
function AffConfSupp(thechosenone) {
     $('.contentDiv').each(function(index) {
          if ($(this).attr("id") == thechosenone) {
               $(this).slideDown(200);
          }
          else {
               $(this).slideUp(600);
          }
     });
 
console.log(" souscategories =  "+ thechosenone); //LOGOK	
}

[mathieu]

dans le code HTML généré, vous avez par exemple cela :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

onclick="AffConfSupp(ConfSousCat3)"

donc le paramètre que vous allez passer à la fonction est un objet HTMLDivElement que vous comparez avec une chaine de caractères.
ce que vous pouvez modifier par exemple, c'est l'appel à la fonction pour passer une chaine de caractère comme cela :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

onclick="AffConfSupp('ConfSousCat3')"

mais vous pouvez aussi utiliser jQuery pour ne pas avoir de JavaScript dans le code HTML comme cela :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
$(function () {
 
    var lignes_AffSSCat = "";
 
 
    $([1, 2, 3, 4]).each(function (index, element) {
 
        lignes_AffSSCat += '<a type="button" class="DelSSC" data-sous-cat="ConfSousCat' + element + '"><i class="glyphicon glyphicon-trash"> action </i></a>';
        lignes_AffSSCat += '<div id="ConfSousCat' + element + '" class="contentDiv" style="display: none;">';
        lignes_AffSSCat += '<div class="col-sm-5">élément ' + element + '</div>';
        lignes_AffSSCat += '<div class="col-sm-7"><p>Voulez-vous supprimer la catégorie ?</p></div>';
        lignes_AffSSCat += '</div>';
 
    });
 
    $("body").append(lignes_AffSSCat);
 
 
    $("a.DelSSC").click(function () {
 
        var thechosenone = $(this).data("sousCat");
 
        console.log(" souscategories =  "+ thechosenone);
 
 
        $('.contentDiv').each(function(index) {
 
            if ($(this).attr("id") === thechosenone) {
                $(this).slideDown(200);
            } else {
                $(this).slideUp(600);
            }
 
        });
 
 
    });
 
 
});

[karpe]

Merci Mathieu !
Bien vu, j'ai effectivement rectifié mon appel et maintenant ça glisse tout seul !

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

onclick="AffConfSupp(\'ConfSousCat'+response.souscategories[i].souscategories_id +'\')"