Discussion :

[Jessyv96]

Bonjour à tous,

Je travaille sur un projet et je suis un peu embêter car je n'arrive pas à accéder à l'attribut data-category pour récuperer une liste de catégorie,

Code :

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

1
2
3
4
5
6
7
 
{% for tool in abcIngTools %}
 <div class="col-sm-4 col-tool {% if user is defined and not user is empty %}
                                                  {{ tool in user.favoriteTools ? 'favorite-tool' : 'no-favorite-tool' }}{% endif %}"
                         data-tool="{{ tool.slug }}" data-category="{{ tool.category.nameCategory }}"
</div>
{% endfor %}

Code :

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

1
2
3
4
5
6
7
 
 
    for(let tool of $('.col-tool')) {
        console.log(tool.data('category));
        abcingTools.push(tool);
        console.log(abcingTools);
    }

La console me retourne q

Code :

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

jquery.min.js:2 Uncaught TypeError: tool.data is not a function

Auriez-vous une solution ? svp

[Toufik83]

Salut,
il y a deux possibilités

Code javascript :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
 
for(let tool of $('.col-tool')) {
        console.log("avec attr :"+$(tool).attr('data-category'));
       //ou avec data
        console.log("avec data :"+$(tool).data('category'));
 }
 
//OU
$('.col-tool').each(function(){
   console.log($(this).attr('data-category'));
  //ou avec data
   console.log($(this).data("category"));
});

[Jessyv96]

J'ai justement essayé cette possibilité mais cela me retourne undefined

[Toufik83]

qu'est ce que tu as mis ? (j'ai testé avant d'envoyer mon post)

[Jessyv96]

VOilà mon fichier .js

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
 
 
$(function () {
    select_category.on('click', function () {
        let category = $(this).val();
        //Ajoute ou retire une catégorie de l'array "categoriesSelected"
        if ( $(this).prop('checked') === false ) {
            let categoryToRemove = category;
            categoriesSelected.splice($.inArray(categoryToRemove, 1),1);
        } else {
            categoriesSelected.push(category);
        }
        //console.log(categoriesSelected);
    });
 
 
     //Récuperer les catégories de chaque outils$
   //$('.col-tool').data('category')
    $('.col-tool').each(function(){
        console.log($(this).attr('data-category'));
        //ou avec data
        console.log($(this).data("category"));
    });
 
    for(let tool of $('.col-tool')) {
        console.log("avec attr :"+$(tool).attr('data-category'));
        //ou avec data
        console.log("avec data :"+$(tool).data('category'));
    }
 
 
    //Comparaison des catégories sélectionnés avec la liste des catégories
 
});

[Toufik83]

Quand tu inspecte la div, tu vois bien une valeur dans l'attribut data-category?