CODEWITHSUNDEEP
javascriptflatpickr
user001
user001

Reputation: 515

Allow date less than minDate in flatpickr

I have the following code:

if (setToToday) {
  this.flatpickr({
      minDate: 'today',
      defaultDate: new Date( $(this).attr("date")),
  });
} else {
    flatpickr(this).setDate(new Date( $(this).attr("date") ));
}

Now what I would like to do is to show the user a date value less than today if the attr(date) is lesser today. Suppose today is 2021-03-03 and the previously selected value was 2021-02-02, I would like to allow the user to select that previous date or any date from today. Nothing in between. How can I do that in flatpickr?

Upvotes: 2

Views: 1491

Answers (1)

iamdhavalparmar
iamdhavalparmar

Reputation: 1218

If you’d like to make certain dates unavailable for selection, there are multiple methods of doing so.

  1. Disabling specific date
  2. Disabling a date range
  3. Disabling dates using a function

Disabling specific dates

{
    disable: ["2025-01-30", "2025-02-21", "2025-03-08", new Date(2025, 4, 9) ],
    dateFormat: "Y-m-d",
}

Disabling range(s) of dates:

{
    dateFormat: "Y-m-d",
    disable: [
        {
            from: "2025-04-01",
            to: "2025-05-01"
        },
        {
            from: "2025-09-01",
            to: "2025-12-01"
        }
    ]
}

Disabling dates by a function:

{
    "disable": [
        function(date) {
            // return true to disable
            return (date.getDay() === 0 || date.getDay() === 6);

        }
    ],
    "locale": {
        "firstDayOfWeek": 1 // start week on Monday
    }
}

Refer to the official documentation for more

Upvotes: 3

Related Questions