Search code examples
javascriptflatpickr

How to convert json object to dates?


I am using flatpicker range and onChange I do:

onChange: function(dateObj, dateStr) {
  console.info(dateObj, dateStr);

That gives me in console:

0: Tue Mar 10 2020 00:00:00 GMT+0100 (Ora standard dell’Europa centrale) {}
1: Thu Mar 12 2020 00:00:00 GMT+0100 (Ora standard dell’Europa centrale) {}

But I am not sure how to convert that to d m Y

Looking for this format with no time or zone: 1/23/2020

Something like:

var dateStart = new Date(data.from);
var dateEnd = new Date(data.to);
dateStart.setHours(0, 0, 0, 0);
dateEnd.setHours(0, 0, 0, 0);

Solution

  • Flatpicker has an option for specifying the format (dateFormat), in your case, since you're working with ranges, the second argument to the onChange callback will have this format: [date value] to [date value], to create a dates array in the required format from this string, you can use secondArgument.split(' to '), here is an example:

    flatpickr("#dateInput", {
      mode: "range",
      dateFormat: "d/m/Y",
      onChange: (_, dateRangeStr) => {
        const datesStrArr = dateRangeStr.split(" to ");
        console.log(datesStrArr);
      }
    });
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/flatpickr/dist/flatpickr.min.css">
    <script src="https://cdn.jsdelivr.net/npm/flatpickr"></script>
    <input id="dateInput" />