JSFiddle - React, Tailwind, and code Playground

by Markinhos

HTML

<script src="http://underscorejs.org/underscore-min.js"></script>
<script src="http://documentcloud.github.io/backbone/backbone-min.js"></script>
<div id="comparator">
    <button id="someButton">Click Me to sort by effdate</button>
    <button id="anotherButton">Click Me to sort by transdate</button>
</div>
<div id="negativeComparator">
    <button id="negativeButton">Click Me to sort by reverse effdate</button>
    <button id="anotherNegativeButton">Click Me to sort by reverse transdate</button>
</div>

JavaScript

$(document).ready(function () {
    var Book = Backbone.Model;
    var books = new Backbone.Collection;

    var sortField = "transdate";
    
    var comparator =  function (book) {
        return book.get(sortField);
    };
    
    var negativeComparator = function (book) {
        return (-1 * book.get(sortField));
    };
    
    books.add(new Book({
        title: "one",
        effdate: new Date("02/01/2012"),
        transdate: new Date("03/01/2019")
    }));
    books.add(new Book({
        title: "two",
        effdate: new Date("02/01/2013"),
        transdate: new Date("03/01/2017")
    }));
    books.add(new Book({
        title: "three",
        effdate: new Date("02/01/2014"),
        transdate: new Date("03/01/2015")
    }));

    $("#someButton").click(function () {
        books.comparator = comparator;
        sortField = "effdate";
        books.sort();
        alert(books.pluck("title"));
    });
    $("#negativeButton").click(function () {
        books.comparator = comparator;
        sortField = "transdate";
        books.sort();
        alert(books.pluck("title"));
    });
    $("#anotherButton").click(function () {
        books.comparator = negativeComparator;
        sortField = "effdate";
        books.sort();
        alert(books.pluck("title"));
    });
    $("#anotherNegativeButton").click(function () {
        books.comparator = negativeComparator;
        sortField = "transdate";
        books.sort();
        alert(books.pluck("title"));
    });

});