Sortieren nach Kategorie; Element hat mehrere Kategorien (isotope.js)

Ich versuche, isotope.js (http://isotope.metafizzy.co/sorting.html) zu verwenden, um ein Raster von Elementen zu sortieren. Das Plugin selbst ist ziemlich einfach, aber ich habe einen kleinen Haken gefunden, auf dem ich keine Dokumentation finden kann.Sortieren nach Kategorie; Element hat mehrere Kategorien (isotope.js)

Ich möchte die Elemente nach ihrer 'Kategorie' sortieren. Dies ist jedoch relativ einfach: Der Haken ist, dass jedes Element möglicherweise mehrere Kategorien haben kann. sehen wie folgt aus

So zum Beispiel das Element könnte ich zu sortieren bin versucht:

<div class="sortable-element" data-category="category_1">

Aber was ich wollte, dass es mehrere Kategorien haben? dh:

<div class="sortable-element" data-category="category_1 category_2 category_3">

Oder:

<div class="sortable-element" data-category="category_1, category_2, category_3">

Wer weiß, wie dies erreicht werden könnte?

Quelle

2016-04-27 Peregrine

Welche Kriterien werden verwendet, um diese zu sortieren? – sminutoli

Sie können nicht mehrere Werte in Ihrem Sortieren nach Feld haben. Sie können jedoch mehr Feld haben, wie in diesem Beispiel:

<div class="grid"> 
    <div class="grid-item" data-color="yellow"> 
    <p class="number">3</p> 
    </div> 
    <div class="grid-item" data-color="blue"> 
    <p class="number">2</p> 
    </div> 
    ... 
</div> 

var $grid = $('.grid').isotope({ 
    getSortData: { 
    color: '[data-color]', 
    number: '.number parseInt' 
    }, 
    // sort by color then number 
    sortBy: [ 'color', 'number' ] 
});

diese Webseite ansehen: http://codepen.io/desandro/pen/sxAJL

Quelle

2016-04-27 17:51:31 Thomas

Ich versuche jedoch nach dynamischen Inhalten zu sortieren. Angenommen, ich bin auf einer Seite, die Webcomics archiviert. Ich möchte nach den Charakteren filtern können, die im Webcomic erscheinen. Also könnte ein Webcomic drei Charaktere haben, ein anderer vielleicht sechs, ein anderer vielleicht drei, aber eine andere drei als der erste ... wie könnte ich danach filtern, wenn Isotope (unerklärlicherweise) einem Sortierfeld nicht erlaubt, mehrere Werte zu haben? – Peregrine

was ist jetzt wichtiger? Sortieren oder Filtern? Für Ihr Beispiel scheint Filterung wichtiger zu sein ... Es ist sicher nicht möglich, ein Feld zu sortieren, das mehrere Werte hat, auf welcher Position sollte Isotop das Feld bringen? Einer vom ersten bis zum zweiten Wert, kann es nur an einer Stelle sein ?! – Thomas

Zum Filtern gibt es gute Beispiele http://isotope.metafizzy.co/v1/docs/filtering.html – Thomas

okay, ich für ein schnelles Beispiel für das Verständnis gemacht:

<section id="options" class="clearfix"> 
    <ul id="filters" class="option-set clearfix" data-option-key="filter"> 
    <li><a href="#" data-filter="*">show all</a></li> 
    <li><a href="#" data-filter=".Superman">Superman</a></li> 
    <li><a href="#" data-filter=".Supergirl">Supergirl</a></li> 
    <li><a href="#" data-filter=".Spiderman">Spiderman</a</li> 
    <li><a href="#" data-filter=".Batman">Batman</a</li> 
    </ul> 
</section> <!-- #options --> 

<div id="container" class="clearfix"> 
    <div class="item Spiderman Superman Hulk"> 
    <p>Comic 1</p> 
    </div> 
    <div class="item Captain-America Superman Supergirl"> 
    <p>Comic 2</p> 
    </div> 
    <div class="item Nightcrawler Sub-Mariner Marv"> 
    <p>Comic 3</p> 
    </div> 
    <div class="item Hulk Nightcrawler Batman"> 
    <p>Comic 4</p> 
    </div> 
    <div class="item Nightcrawler Hulk Supergirl"> 
    <p>Comic 5</p> 
    </div> 
</div>

Siehe http://codepen.io/anon/pen/MyPNQJ

Quelle

2016-04-30 07:32:30 Thomas

Sortieren nach Kategorie; Element hat mehrere Kategorien (isotope.js)

Antwort

Verwandte Themen