I am a newbie programmer. I want to download json data from filtered json data that I have to CSV file. Here, my JSON API data:
The step should be like this:
Pick date range from datepicker (example: 7May-8May)
The filtered data will appear in inspect element using command console.log(filteredData)
After that click the download button, and the filtered data (which is data from 7May-8May) will be downloaded.
I can do step 1 and step 2. But step 3 didn't work in my code. Anyone can help me with the code? Currently, this is my code: https://jsfiddle.net/estri012/2x3hmaLo/100/
$(function() {
$('input[name="datefilter"]').daterangepicker({
showDropdowns : true,
autoUpdateInput: false,
locale: {
cancelLabel: 'Clear'
}
});
$('input[name="datefilter"]').on('apply.daterangepicker', function(ev, picker) {
$(this).val(picker.startDate.format('YYYY-MM-DD') + ' - ' + picker.endDate.format('YYYY-MM-DD'));
var startDate = picker.startDate.format('YYYY-MM-DD');
var endDate = picker.endDate.format('YYYY-MM-DD');
if (startDate != '' && endDate != '') {
console.log(startDate, endDate);
var endpoint = 'https://gmlews.com/api/data/?node_id=1';
$.ajax({
method: "GET",
url: endpoint,
data: {
startDate: startDate,
endDate: endDate
},
success: function(data){
var data = data;
let filteredData = _.filter(data, function(data){
return (data.timestamp > startDate &&
data.timestamp < endDate)
});
console.log(filteredData);
} //function(data)end
}) //ajax end
} //if function end
$('input[name="datefilter"]').on('cancel.daterangepicker', function(ev, picker) {
$(this).val('');
});
}); //apply button end
//download button
$("#button1").on('click', function(e) {
// JSON to CSV Converter
function ConvertToCSV(objArray) {
var array = typeof objArray != 'object' ? JSON.parse(objArray) : objArray;
var str = '';
for (var i = 0; i < array.length; i++) {
var line = '';
for (var index in array[i]) {
if (line != '') line += ','
line += array[i][index];
}
str += line + '\r\n';
}
return str;
}
// Example
$(document).ready(function () {
// Create Object
var filteredData = filteredData;
// Convert Object to JSON
var jsonObject = JSON.stringify(filteredData);
// Convert JSON to CSV & Display CSV
$('#button1').onclick(ConvertToCSV(jsonObject));
});
})
}); //js function end
Here is a working script,
What did I do?
Removed the document.ready around the button, it was already in the document.ready
Disabled the button until there actually WAS a filtered data
Removed filteredData vars from all over the place and make it a global var
Find the CDN for the JSON2
Created a better csv converter (Quoting strings)
Removed underscore and JSON2
let filteredData;
const ConvertToCSV = data => {
if (!data || data.length === 0) {
console.log("data was empty");
return;
}
let csv = [Object.keys(data[0]).slice(0).join(",")];
data.forEach(
item => csv.push(
Object.values(item).map(val => isNaN(val) ? '"'+val+'"':val).join(",")
)
)
csv=csv.join("\n");
console.log(csv);
const $link = $('<a/>',{ href: "data:text/csv;charset=utf-8,"+escape(csv), download:"filename.csv",text:"download"});
$link[0].click(); // have to trigger native click
};
$(function() {
$('input[name="datefilter"]').daterangepicker({
showDropdowns: true,
autoUpdateInput: false,
locale: {
cancelLabel: 'Clear'
}
});
// Convert JSON to CSV & Display CSV
$('#button1').on("click", function() {
if (filteredData) ConvertToCSV(filteredData)
else alert("Please get data first");
}).prop("disabled", true);
$('input[name="datefilter"]').on('apply.daterangepicker', function(ev, picker) {
$(this).val(picker.startDate.format('YYYY-MM-DD') + ' - ' + picker.endDate.format('YYYY-MM-DD'));
var startDate = picker.startDate.format('YYYY-MM-DD');
var endDate = picker.endDate.format('YYYY-MM-DD');
if (startDate != '' && endDate != '') {
console.log(startDate, endDate);
var endpoint = 'https://gmlews.com/api/data/?node_id=1';
$.ajax({
method: "GET",
url: endpoint,
data: {
startDate: startDate,
endDate: endDate
},
success: function(data) {
filteredData = data.filter(item => item.timestamp > startDate && item.timestamp < endDate)
console.log(filteredData);
$('#button1').prop("disabled",false);
} //function(data)end
}) //ajax end
} //if function end
$('input[name="datefilter"]').on('cancel.daterangepicker', function(ev, picker) {
$(this).val('');
});
}); //apply button end
//download button
}); //js function end
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.0/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.24.0/moment.min.js"></script>
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/daterangepicker/daterangepicker.min.js"></script>
<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/daterangepicker/daterangepicker.css" />
<ol class="breadcrumb">data from date : <input type="text" name="datefilter" value="" /></ol>
<p>Click this button to download all data from node 1</p>
<div>
<button id="button1" type="button" class="button"><span>Download</span></button>
</div>
Test:
2020-05-03 - 2020-05-12
id,timestamp,vibration,moisture,gps_latitude,gps_longitude,gyro_x,gyro_y,gyro_z,accelero_x,accelero_y,accelero_z,displacement,node_id
83,2020-05-07T15:16:31.458380+07:00,2,30,-7.758856,110.376388,0.234,0.083,0.548,0.47,0.23,0.83,4,1
84,2020-05-07T21:14:19.171388+07:00,2,30,-7.758456,110.376388,0.34,0.83,0.48,0.47,0.23,0.83,4,1
This should work: https://jsfiddle.net/maxim_mazurok/m23x7n04/16/
Learn more about JavaScript Scope
This was the main issue:
var filteredData = filteredData;
The problem in the code was a simple discrepancy between the variable reference of "filteredData", as it was defined in multiple different scopes, without a global reference to the main one which it was supposed to be, after the ajax call was made. Secondly in the later part, there was a discrepancy between the onclick events of #button1, it only needs to be defined once. The following code is able to at least generate a JSON string after the dates are selected, and getting that into a CSV file is trivial, just map the array to comma separated values and stringify it. Anyways:
$(function() {
$('input[name="datefilter"]').daterangepicker({
showDropdowns : true,
autoUpdateInput: false,
locale: {
cancelLabel: 'Clear'
}
});
let filteredData;
$('input[name="datefilter"]').on('apply.daterangepicker', function(ev, picker) {
$(this).val(picker.startDate.format('YYYY-MM-DD') + ' - ' + picker.endDate.format('YYYY-MM-DD'));
var startDate = picker.startDate.format('YYYY-MM-DD');
var endDate = picker.endDate.format('YYYY-MM-DD');
if (startDate != '' && endDate != '') {
console.log(startDate, endDate);
var endpoint = 'https://gmlews.com/api/data/?node_id=1';
$.ajax({
method: "GET",
url: endpoint,
data: {
startDate: startDate,
endDate: endDate
},
success: function(data){
var data = data;
filteredData = _.filter(data, function(data){
return (data.timestamp > startDate &&
data.timestamp < endDate)
});
console.log(filteredData);
} //function(data)end
}) //ajax end
} //if function end
$('input[name="datefilter"]').on('cancel.daterangepicker', function(ev, picker) {
$(this).val('');
});
}); //apply button end
//download button
$("#button1").on('click', function(e) {
// JSON to CSV Converter
function ConvertToCSV(objArray) {
// console.log(typeof objArray, objArray)
var array = typeof objArray != 'object' ? JSON.parse(objArray) : objArray;
// console.log("YO", array)
var str = '';
for (var i = 0; i < array.length; i++) {
var line = '';
for (var index in array[i]) {
if (line != '') line += ','
line += array[i][index];
}
str += line + '\r\n';
}
return str;
}
var jsonObject = JSON.stringify(filteredData);
var csv = ConvertToCSV(jsonObject)
var a = document.createElement("a")
var blob = new Blob([csv])
a.download = "test.csv"
a.href = URL.createObjectURL(blob);
a.click();
})
}); //js function end
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.0/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.24.0/moment.min.js"></script>
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/daterangepicker/daterangepicker.min.js"></script>
<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/daterangepicker/daterangepicker.css" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.9.1/underscore-min.js"></script>
<script type="text/javascript" src="https://github.com/douglascrockford/JSON-js/raw/master/json2.js"></script>
<ol class="breadcrumb">data from date : <input type="text" name="datefilter" value="" /></ol>
<p>Click this button to download all data from node 1</p>
<div>
<button id="button1" class="button"><span>Download</span></button>
</div>
Related
i am trying to generate dynamically the disabled dates using ajax call , and pass the result to datesDisabled option of bootstrap datepicker , or for other alternative pass the result to beforeShowDay option , but it doesn't work for dynamically created array Result, but it worked fine for hard coded array.
In fact , when i use dynamically generated Array , the Date Array is passed to beforeShowDay in the second time i choose dates from datepicker, and it is not passed to the picker in the first time,
but when hard coded, the array is perfectly passed to beforShowDay from the first time the picker is clicked.
the dynamically created array is
Date Array:
2021-03-17,2021-03-18,2021-03-24,2021-04-06,2021-04-07,2021-04-13,2021-04-14
so what am doing wrong?
<script type="text/javascript">
$(document).ready(function () {
function GetHolidayOrStopDay() {
// alert("Get Holidays");
var DateArray = new Array();
$.ajax({
type: "POST",
url: "timeObjectWebService.asmx/GetHolidaysAndDisabledDays",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (data) {
var JsonObject = JSON.parse(data.d);
$(JsonObject).each(function (index, da) {
var testJsonDate = formatJsonDate(da.HolidayDate);
var options = {
year: "numeric",
month: "numeric",
day: "numeric",
};
var result = testJsonDate.toLocaleDateString("en", options);
result = new Date(result);
var DateResult = formatDate(result);
//if (index < (JsonObject.length - 1)) {
DateArray.push(DateResult);
// }
// else {
// DateArray += DateResult;
//}
console.log("rrr : " + DateResult);
});
//DateArray += ']';
console.log("Date Array :" + DateArray);
//console.log("1 : " + DateArray[1]);
},
error: function (err) {
//alert("test err");
console.log(err);
},
});
//alert(DateArray);
TestdisabledDays = DateArray;
return DateArray;
}
function formatJsonDate(jsonDate) {
var dat = new Date(parseInt(jsonDate.substr(6)));
return dat;
}
var enableDays = ["2021-03-30"];
var disabledDays = [
"2021-03-23",
"2021-03-22",
"2021-03-30",
"2021-03-29",
"2021-03-28",
"2021-04-01",
]; //for this hardcoded array everything works fine
var TestdisabledDays = new Array();
TestdisabledDays = GetHolidayOrStopDay();
//GetHolidayOrStopDay();
function formatDate(d) {
var day = String(d.getDate());
//add leading zero if day is is single digit
if (day.length == 1) day = "0" + day;
var month = String(d.getMonth() + 1);
//add leading zero if month is is single digit
if (month.length == 1) month = "0" + month;
return d.getFullYear() + "-" + month + "-" + day;
}
$("#dtpicker").datepicker({
format: "dd-mm-yyyy",
autoclose: true,
startDate: "0d",
datesDisabled: [TestdisabledDays],
beforeShowDay: function (date) {
//alert("from picker");
//for disable weekends :
var dayNr = date.getDay();
if (dayNr == 0 || dayNr == 6) {
if (enableDays.indexOf(formatDate(date)) >= 0) {
return true;
}
return false;
}
if (TestdisabledDays.indexOf(formatDate(date)) >= 0) {
console.log("index of " + TestdisabledDays.indexOf(formatDate(date))); //disabledDays
console.log("TestdisabledDays = " + TestdisabledDays); //disabledDays
return false;
}
return true;
},
});
});
</script>
ajax and datepicker init are running asychronically the picker is initializing before the ajax is done(that's why it is working second time), to solve this you might consider using $.when (api.jquery.com/jquery.when) or init the datepicker then when ajax return response use the methods of the datepicker itself (bootstrap-datepicker.readthedocs.io/.../methods...) hope this helps
I want to disable dates in flatpicker plugin by a list from the database. this is the code to get them from the database
public List<DateTime> DisablingDates()
{
List<DateTime> dates = new List<DateTime>();
var groups = OrderContext.Collection().GroupBy(o => o.DueDate);
foreach (var g in groups)
{
if (g.Count() == 2)
{
var val = g.Key.Date;
val.ToString("dd/MMM/yyyy");
dates.Add(val);
}
}
return dates;
}
I passed the list through viewbag to the jquery but the plugin stopped working.. the browser debugger showes the DisabledDates array with timestamp dates , so I tried to convert them to readble dates but the alert function doesn't show the values.
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/flatpickr/4.6.6/flatpickr.min.js"></script>
<script>
$("#datepicker").flatpickr({
enableTime: false,
dateFormat: "d/M/Y",
defaultDate: new Date().fp_incr(2),
minDate: new Date().fp_incr(2),
maxDate: new Date().fp_incr(90),
disable:
function (date) {
var DisabledDates = #Html.Raw(Json.Encode(ViewBag.DisabledDates));
var array = [];
$.each(DisabledDates, function (index, value) {
var date1 = new Date(value * 1000).toDateString();
alert(index + ": " + date1);
array.push(date1);
});
var fulldmy = date.getDate() + "/" + (date.getMonth() + 1) + "/" + date.getFullYear();
if ($.inArray(fulldmy, array) === -1) {
return false;
} else {
return true;
}
},
});
DisabledDates array in the browser debugger
function (date) {
var DisabledDates = ["\/Date(1599166800000)\/","\/Date(1599253200000)\/","\/Date(1599944400000)\/"];
var array = [];
then I tried using JsonResult action with an ajax method and the plugin stopped working again.
$("#datepicker").flatpickr({
enableTime: false,
dateFormat: "d/M/Y",
defaultDate: new Date().fp_incr(2),
minDate: new Date().fp_incr(2),
maxDate: new Date().fp_incr(90),
disable: function (date) {
$.ajax({
url: '#Url.Action("GetReservedDates", "Basket")',
type: "GET",
success: function (result) {
var fulldate = date.getDate() + "/" + (date.getMonth() + 1) + "/" + date.getFullYear();
if ($.inArray(fulldate, result) === -1) {
return false;
} else {
return true;
}
}
});
}
});
the JsonResult action
[HttpGet]
public JsonResult GetReservedDates()
{
var dates = orderService.DisablingDates();
return Json(new { dates }, "text/x-json", JsonRequestBehavior.AllowGet);
}
this is the second plugin I'm currently tring.
What should I do?
Thanks in advance.
I found what made the plugin stop working .. the disable option takes a function between array brackets [].
then to convert the timestamp dates to readable dates I edited the value to contain only milliseconds from /Date(1599166800000)/ to 1599166800000.
finally, the plugin disabled the database-retrieved dates as intended.
$("#datepicker").flatpickr({
enableTime: false,
dateFormat: "d/M/Y",
defaultDate: new Date().fp_incr(2),
minDate: new Date().fp_incr(2),
maxDate: new Date().fp_incr(90),
disable: [Ddates],
onMonthChange: [Ddates],
});
function Ddates (date) {
var DisabledDates = #Html.Raw(Json.Encode(ViewBag.DisabledDates));
var array = [];
$.each(DisabledDates, function (index, value) {
value = value.replace("\\", "")
value = value.replace("/Date(", "")
value = value.replace(")\/", "")
var date1 = new Date(parseInt(value, 10)).toLocaleDateString();
array.push(date1);
});
date = date.toLocaleDateString();
return ($.inArray(date, array) != -1);
}
Hi guys! I have this pop up that recognizes current users in SP 2013
and displays a message to them. I need this to display once a day when
they first log in. Any help would be greatly appreciated! Here's the
code:
<script>
$(document).ready(function () {
$("#popup").hide().fadeIn(500);
$(".cover").fadeTo(500, 0.5);
$("#close").on("click", function (e) {
e.preventDefault();
$("#popup").fadeOut(500);
$(".cover").fadeOut(500);
});
});
</script>
<!--Get SharePoint User-->
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.SPServices/2014.02/jquery.SPServices-2014.02.js" type="text/javascript"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script type="text/javascript">
var loginName = "";
var userid = _spPageContextInfo.userId;
GetCurrentUser();
function GetCurrentUser() {
var requestUri = _spPageContextInfo.webAbsoluteUrl + "/_api/web/getuserbyid(" + userid + ")";
var requestHeaders = { "accept" : "application/json;odata=verbose" };
$.ajax({
url : requestUri,
contentType : "application/json;odata=verbose",
headers : requestHeaders,
success : onSuccess,
error : onError
});
}
function onSuccess(data, request) {
var loginName = data.d.Title;
//alert("Hello " + loginName);
document.getElementById("userNameMessage").innerHTML = "hello" + "<b>" + loginName + "</b>";
}
function onError(error) {
alert(error);
}
</script>
You could try below logic.
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script type="text/javascript">
$(function () {
var key = 'DailyReminder';
var reminderTimeKey = 'ReminderTimes';
var ReminderDate = localStorage.getItem(key);
if (!ReminderDate) {
var d = new Date();
d.setHours(0, 0, 0, 0);
localStorage.setItem(key, d);
localStorage.setItem(reminderTimeKey, 1);
alert('hi');
} else {
var RemindTimes = localStorage.getItem(reminderTimeKey);
var d = new Date();
d.setHours(0, 0, 0, 0);
if (RemindTimes < 1 || ReminderDate != d) {
localStorage.setItem(key, d);
localStorage.setItem(reminderTimeKey, 1);
alert('hi');
}
}
})
</script>
Use localStorage. Use date as & a Boolean value.Inside OnSuccess function retrieve localStorage key and check if the date key is same as cuurent date. If same and if its' value is true which mean the messsage is shown if the date key and current date is not same then show message and update date in local storage to current date
Hello I am a newbie programmer.
I want to get data from my API with datepicker filter.This is my API URL:https://gmlews.com/api/data/?node_id=1
First, I choose the date that I want from my datepicker. And then the data will be displayed with console.log() command.
I know how to display all data, but I don't know how to display filtered data from datepicker. The filter that I made in my code doesn't work. I think my code is wrong. This is my first code: https://jsfiddle.net/estri012/2x3hmaLo/56/
$(function() {
$('input[name="datefilter"]').daterangepicker({
showDropdowns: true,
autoUpdateInput: false,
locale: {
cancelLabel: 'Clear'
}
});
$('input[name="datefilter"]').on('apply.daterangepicker', function(ev, picker) {
$(this).val(picker.startDate.format('YYYY-MM-DD') + ' - ' + picker.endDate.format('YYYY-MM-DD'));
var fromDate = picker.startDate.format('YYYY-MM-DD');
var toDate = picker.endDate.format('YYYY-MM-DD');
if (fromDate != '' && toDate != '') {
console.log(fromDate, toDate);
var endpoint = 'https://gmlews.com/api/data/?node_id=1';
$.ajax({
method: "GET",
url: endpoint,
data: {
fromDate: fromDate,
toDate: toDate
},
success: function(data) {
console.log(data);
var resultData = data.filter(function (a) {
var hitDates = a.timestamp || {};
// extract all date strings
hitDates = Object.keys(hitDates);
var hitDateMatchExists = hitDates.some(function(dateStr) {
var date = new Date(dateStr);
return date >= fromDate && date <= toDate
});
return hitDateMatchExists;
});
console.log(resultData);
} //function(data)end
}); //ajax end
} //if function end
$('input[name="datefilter"]').on('cancel.daterangepicker', function(ev, picker) {
$(this).val('');
});
}); //apply button end
}); //function end
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.0/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.24.0/moment.min.js"></script>
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/daterangepicker/daterangepicker.min.js"></script>
<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/daterangepicker/daterangepicker.css" />
<ol class="breadcrumb">data from date : <input type="text" name="datefilter" value="" /></ol>
For example, I want to display all the data from 7 May until 8 May. So first, I pick 7 May to 8 May from my datepicker and then click apply. After I click apply, in the inspect element should show the data from 7 May until 8 May.
Can someone help me fix this code? Thankyou.
It solved! I am using plugin underscore.js. This is my final code: https://jsfiddle.net/estri012/2x3hmaLo/71/
$(function() {
$('input[name="datefilter"]').daterangepicker({
showDropdowns : true,
autoUpdateInput: false,
locale: {
cancelLabel: 'Clear'
}
});
$('input[name="datefilter"]').on('apply.daterangepicker', function(ev, picker) {
$(this).val(picker.startDate.format('YYYY-MM-DD') + ' - ' + picker.endDate.format('YYYY-MM-DD'));
var startDate = picker.startDate.format('YYYY-MM-DD');
var endDate = picker.endDate.format('YYYY-MM-DD');
if (startDate != '' && endDate != '') {
console.log(startDate, endDate);
var endpoint = 'https://gmlews.com/api/data/?node_id=1';
$.ajax({
method: "GET",
url: endpoint,
data: {
startDate: startDate,
endDate: endDate
},
success: function(data){
var data = data;
var filteredDates = _.filter(data, function(data){
return (data.timestamp > startDate &&
data.timestamp < endDate)
});
console.log(filteredDates);
} //function(data)end
}); //ajax end
} //if function end
$('input[name="datefilter"]').on('cancel.daterangepicker', function(ev, picker) {
$(this).val('');
});
}); //apply button end
}); //function end
<script type="text/javascript">
$(document).ready(function() {
$.ajax({
type: "POST",
url: "dates.php",
success: function(data) {
var obj = $.parseJSON(data);
var date = '"'
$.each(obj, function() {
date = date + this['date'] + '","';
});
date = date + '"';
$(document).ready(function() {
$('#datepicker').datepicker({
dateFormat: 'yy-mm-dd',
beforeShowDay: checkAvailability,
});
});
var $myBadDates = new Array(date);
function checkAvailability(mydate){
var $return=true;
var $returnclass ="available";
$checkdate = $.datepicker.formatDate('yy-mm-dd', mydate);
for(var i = 0; i < $myBadDates.length; i++)
{
if($myBadDates[i] == $checkdate)
{
$return = false;
$returnclass= "unavailable";
}
}
return [$return,$returnclass];
}
}
});
});
</script>
This is my existing code. I just want to disable some dates in datepicker coming from database.
$myBadDates takes array of dates like this "2017-05-01", "2017-05-02" which is coming in var date. But for some reason it is not working. When I put hand-written dates in $myBadDates it works well, but with var date it is not working.
I am unable to understand what is happening here as I am new to JavaScript and JSON.
Changing one array into another is done using Array.prototype.map:
var result = input.map(function(e) { return e.date; });
ES6:
var result = input.map(e => e.date);
var input = [{"date":"2017-05-01"},{"date":"2017-04-10"},{"date":"2017-05-02"},{"date":"2017-04-30"},{"date":"2017-04-29"},{"date":"2017-04-28"},{"date":"2017-04-27"},{"date":"2017-04-26"},{"date":"2017-04-25"},{"date":"2017-04-24"},{"date":"2017-04-23"},{"date":"2017-04-14"},{"date":"2017-04-20"},{"date":"2017-05-03"},{"date":"2017-04-22"},{"date":"2017-04-21"},{"date":"2017-05-04"},{"date":"2017-04-19"},{"date":"2017-04-18"},{"date":"2017-04-17"},{"date":"2017-04-16"},{"date":"2017-04-11"},{"date":"2017-04-15"},{"date":"2017-05-05"},{"date":"2017-04-13"},{"date":"2017-04-12"},{"date":"2017-04-09"},{"date":"2017-04-08"},{"date":"2017-04-07"},{"date":"2017-04-06"},{"date":"2017-04-05"},{"date":"2017-04-04"},{"date":"2017-04-03"},{"date":"2017-04-02"},{"date":"2017-04-01"},{"date":"2017-03-31"},{"date":"2017-03-30"},{"date":"2017-02-07"},{"date":"2017-03-29"},{"date":"2017-03-28"},{"date":"2017-03-27"},{"date":"2017-02-08"},{"date":"2017-03-26"},{"date":"2017-03-25"},{"date":"2017-03-24"},{"date":"2017-03-23"},{"date":"2017-03-22"},{"date":"2017-03-21"},{"date":"2017-03-20"},{"date":"2017-02-28"}];
var output = input.map(function(e){ return e.date; });
console.log(output);