Javascript Question posted in
A very good W3school tutorial can be found here.

Javascript – How to remove the default date in flatpickr

The issue i am facing is the i don’t seem to find any information about deselect the default date(current day).


flatpickr("#datepicker", {
    defaultDate: '',
    dateFormat: "d-m-Y H:i",
    enableTime: true,
    open: true,
    inline: true,
    minDate: "today",
});

I try to use the "defaultDate" as many examples in the web but nothing seems to work. I have not find any information in the documentation except "defaultDate".

I try as well to use onChange , onReady and onOpen nothing seems to work.

 onChange: function(selectedDates, dateStr, instance) {
                    instance.clear();
Tags:

2

Answers


  1. Chosen as BEST ANSWER
    0

    What i figure out is that with the solution of @IT goldman and windows.onload it works like a charm! Much thanks again!

    window.onload = (event) => {
document.querySelectorAll(".flatpickr-day").forEach(elem => elem.classList.remove("today"))

    };


  2. 0

    Lookin the source code and/or using the DevTools inspector, you can tell that the culprit is the class .today. So let’s remove it on the event of open.

    flatpickr("#date", {

  onOpen: [
    function(selectedDates, dateStr, instance) {
      instance.calendarContainer.querySelectorAll(".flatpickr-day").forEach(elem => elem.classList.remove("today"))
    },
  ],

});
    .flatpickr-day.today {
  border-color: transparent !important;
}
    <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="date">
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search