Bonjour, sur mon site j'ai une rubrique me permettant de creer des notes sous formes de sticker, l'utilisateur peut interagir avec ( supprimer , changer couleur , deplacer ect.. ). Il peut aussi creer des categories et placer ces notes dedans ( notes supprimes , notes importantes ect... ), ces categories sont sous forme d'onglets mais ne sont pas de nouvelles pages, lorsque l'utilisateur clique sur l'une des categories, seul les notes affectees a cette categorie s'affichent.

Je voudrais savoir comment faire exactement
J'avais penser a foutre un id specifique au bloc, par exemple l'utilisateur affecte au bloc 3 la categorie important donc j'affecte l'id importantx a ce bloc et lorque que j'affiche les blocs concernant cette categorie je cache ( .hide() ) tous les blocs n'ayant pas l'id important.

Je ne sais pas si c'est une bonne idee, je suis debutant en html / jquery donc j'aimerais juste un avis la dessus.

Merci

( oui c'est le meme principe que google keep )

T'as essayé ta solution ?
Grossièrement, c'est une idée viable.

<ul>
    <li class="category" data-id="2">Catégorie 1</li>
    <li class="category" data-id="1">Catégorie 2</li>
    <li class="category" data-id="10">Catégorie 3</li>
</ul>

<div class="sticker" data-category="2">Sticker 1 catégorie 1</div>
<div class="sticker" data-category="2">Sticker 2 catégorie 1</div>

<div class="sticker" data-category="1">Sticker 1 catégorie 2</div>
<div class="sticker" data-category="1">Sticker 2 catégorie 2</div>

<div class="sticker" data-category="10">Sticker 1 catégorie 3</div>
<div class="sticker" data-category="10">Sticker 2 catégorie 3</div>
<div class="sticker" data-category="10">Sticker 3 catégorie 3</div>

var toggleStickers = function(id) {
    $('.sticker:not([data-category="' + id + '"])').hide();
    $('.sticker[data-category="' + id + '"]').show();
}

var toggleStickersHandler = function(e) {
    var id = $(e.target).data('id');
    toggleStockers(id);
}

$('.category').click(toggleStickersHandler);

Oui voila comme ca , merci