JSFiddle - React, Tailwind, and code Playground

by teknohippy

HTML

<button data-bind="clicl:sortTasks">sort</button>
<pre data-bind="text: ko.toJSON($root, null, 2)"></pre>

JavaScript

function UnitViewModel() {

    var self = this;
	self.names = ko.observableArray(["Chuck", "Alice", "Derek", "Bob"]);
    self.goals = ko.observableArray([new Goal(), new Goal()]);
    

    self.sortTasks = function () {
        ko.utils.arrayForEach(self.goals, function (item) {
            item.tasks().sort(function (a, b) {
                alert(item.number);
                return (a.number() < b.number() ? -1 : (a.number() > b.number() ? 1 : 0));
            });
        });
        self.names.sort();
    };
}

function Goal() {
    var self = this;
    self.tasks = ko.observableArray([
        new Task(3, "12/12/2012"),
        new Task(1, "1/12/2012"),
        new Task(2, "6/12/2012")
    ]);
}

function Task(n, d) {
    var self = this;
    self.number = n;
    self.date = ko.observable(new Date(d));
}


// deferred startup
ko.applyBindings(new UnitViewModel());