JSFiddle - React, Tailwind, and code Playground
by mori57
HTML
<button id="gotime">Sort it!</button>
<pre id="out"></pre>
JavaScript
var data = {"days": {
"1": {
"places": [{
"url": "/attraction/mauna-kea-summit/19",
"img_src": "http://trekeffect.images.user_images.s3.amazonaws.com/4_36.jpg",
"title": "Mauna Kea Summit",
"time_going_hour": 1,
"time_going_minutes": 55,
"duration": "3600",
"id": 19,
"type": "attraction",
"city_id": 6
}, {
"url": "/attraction/the-st.-benedict-painted-church/21",
"img_src": "http://trekeffect.images.user_images.s3.amazonaws.com/4_42.jpg",
"title": "The St. Benedict Painted Church",
"time_going_hour": 8,
"time_going_minutes": 35,
"duration": "2600",
"id": 21,
"type": "attraction",
"city_id": 6
}, {
"url": "/attraction/mauna-kea-summit/19",
"img_src": "http://trekeffect.images.user_images.s3.amazonaws.com/4_36.jpg",
"title": "Mauna Kea Summit",
"time_going_hour": 3,
"time_going_minutes": 51,
"duration": "3600",
"id": 19,
"type": "attraction",
"city_id": 6
}]
}
}};
var out = document.querySelector("#out");
var sortData = function(){
out.innerHTML = "Data before sort:\n";
_.each(data.days["1"], function(row) {
console.log(row);
out.innerHTML += row.time_going_hour + "\n";
});
var outData = _.sortBy(data.days["1"], function(row) {
return row.time_going_hour;
});
out.innerHTML += "\n\nData after sort:\n";
_.each(outData, function(row) {
console.log(row);
out.innerHTML += row.time_going_hour + "\n";
});
};
var btn = document.querySelector("#gotime");
btn.addEventListener("click", sortData);