comment trier par date (nouveau) avec jquery isotope

Question

Pardonnez-moi car je suis un peu novice en matière de JS, j'en sais juste assez pour manipuler.

Pour ceux qui connaissent Isotope ( http://isotope.metafizzy.co/docs/sorting.html ), j'ai un bouton en haut d'une page pour trier par date. Isotope trouve l'élément

<span class="date"> 01/04/2012 </span>

avec ceci :

$container.isotope({
    getSortData : {
        date : function ( $elem ) {
        return $elem.find('.date').text();
}});

Ce qui fonctionne bien, mais j'ai besoin d'inverser (descendre) l'ordre des dates.

L'isotope a une fonction :

$('#container').isotope({ 
  sortBy : 'date',
  sortAscending : false
});

Mais je ne parviens pas à le faire fonctionner - cela ne fait que trier par date le paramètre par défaut, au lieu de trier lorsque je clique. Je pense que c'est juste une question de syntaxe... comment/où puis-je mettre sortAscending : false ? ?

Merci...

EDIT En consultant certaines sources de Demos, je vois cela :

<a href="#sortAscending=false">

C'est possible, mais je fais déjà le tri en passant par là :

<a href="#sortBy=date">

Ce qui permet de retrouver un intervalle de temps antérieur avec les informations de date...

Answer 1

Voici comment j'ai procédé, jsFiddle

$container.isotope({
    itemSelector: '.element',
    getSortData: {
        date: function ($elem) {
            return Date.parse($elem.find('.date').text());
        }
    }
});

Le format de la date ne semble pas avoir d'importance et fonctionne en ordre croissant ou décroissant.

La méthode parse() analyse une chaîne de dates et renvoie le nombre de millisecondes entre la chaîne de dates et minuit le 1er janvier 1970.

En fait, il transforme vos chaînes de dates en chiffres solides et faciles à comparer.

Answer 2

Voici ce que j'ai fait pour trier par date.

Si votre date est au format '01/01/2012', vous devez la convertir en un objet date javascript.

getSortData: {
    date: function ($elem) {
        var dateStr = $elem.find('.date').text(),
            dateArray = dateStr.split('/'),
            year = dateArray[2],
            month = dateArray[0],
            day = dateArray[1];
        return new Date(year, month, day);
    }
}

puis vous faites comme d'habitude

$('#container').isotope({ sortBy: 'date' });