NotaGuruAtAll
NotaGuruAtAll

Reputation: 533

jQuery Isotope - How To Sort Alphabetically?

Using the isotope library and trying to make it sort alphabetically. My approach so far is as follows:

<div class="sort-block">
  <div name="a">a<div>
  <div name="z">z</div>
  <div name="w">w</div>
</div>

And initializing isotope as follows:

var $container = $('.chair-block').isotope({
  getSortData: {
    name: '.name' // text from querySelector
}
});

But nothing happens with the order. Any isotope gurus out there?

Upvotes: 0

Views: 2185

Answers (1)

Macsupport
Macsupport

Reputation: 5444

Would need to see more of your code or make a jsfiddle but you need to have a class of name, not name="a", etc. Also, your isotope container is chair-block, not sort-block. Your isotope code is not correct. As I said, more code to get your help. Are you loading isotope after jQuery, are you using v2?

<div class="chair-block">
<div class="item name">a<div>
<div class ="item name">z</div>
<div class ="item name">w</div>
 </div>

Javascript

 var $container = $('.chair-block');
 $container.isotope({
 itemSelector: '.item',
 masonry: {
    columnWidth: 100
 },
 getSortData: {
    name: '.name' // text from querySelector
 }
 });

Here is a sorting codepen

Upvotes: 1

Related Questions