Отключение дней недели

Flatpickr предоставляет гибкую модель ограничения доступных дат через конфигурации disable и enable, однако прямого параметра «отключить дни недели» в виде отдельной опции не существует. Реализация подобного поведения строится на уровне пользовательской логики с использованием функций фильтрации дат и анализа значения Date.getDay().

В основе логики отключения дней недели лежит стандартный метод Jav * aScript:

  • date.getDay() возвращает номер дня недели:

    • 0 — воскресенье
    • 1 — понедельник
    • 2 — вторник
    • 3 — среда
    • 4 — четверг
    • 5 — пятница
    • 6 — суббота

Flatpickr использует объекты Date в локальном часовом поясе браузера, поэтому вычисление дня недели происходит без дополнительной конвертации.

Базовое отключение выходных дней

Наиболее распространённый сценарий — отключение субботы и воскресенья. Реализуется через функцию в массиве disable.

flatpickr("#calendar", {
  disable: [
    function(date) {
      return (date.getDay() === 0 || date.getDay() === 6);
    }
  ]
});

Функция возвращает true для дат, которые должны быть недоступны. Любая дата, удовлетворяющая условию, блокируется в интерфейсе календаря.

Отключение произвольных дней недели

Для гибкой настройки используется проверка через массив запрещённых значений.

const disabledDays = [1, 3, 5]; // понедельник, среда, пятница

flatpickr("#calendar", {
  disable: [
    function(date) {
      return disabledDays.includes(date.getDay());
    }
  ]
});

Такой подход позволяет централизованно управлять правилами без изменения логики компонента.

Инверсия логики через enable

Flatpickr поддерживает альтернативный режим — enable, при котором задаются только разрешённые даты. Остальные автоматически блокируются.

const allowedDays = [1, 2, 3, 4, 5]; // только будни

flatpickr("#calendar", {
  enable: [
    function(date) {
      return allowedDays.includes(date.getDay());
    }
  ]
});

В этом случае выходные исключаются косвенно через отрицательную фильтрацию.

Комбинирование с диапазонами дат

Отключение дней недели часто применяется вместе с ограничением диапазона через minDate и maxDate.

flatpickr("#calendar", {
  minDate: "2026-01-01",
  maxDate: "2026-12-31",
  disable: [
    function(date) {
      return date.getDay() === 0;
    }
  ]
});

Подобная комбинация формирует ограниченное окно с дополнительной фильтрацией по дням недели.

Динамическое изменение правил отключения

Flatpickr поддерживает изменение конфигурации во время выполнения через метод set.

const fp = flatpickr("#calendar", {
  disable: []
});

const disableWeekends = () => {
  fp.set("disable", [
    function(date) {
      return date.getDay() === 0 || date.getDay() === 6;
    }
  ]);
};

Изменение правил применяется без пересоздания экземпляра календаря, что важно при интерактивных интерфейсах.

Многоуровневая фильтрация дат

Функция disable может объединять несколько условий одновременно:

flatpickr("#calendar", {
  disable: [
    function(date) {
      const isWeekend = date.getDay() === 0 || date.getDay() === 6;
      const isFirstDay = date.getDate() === 1;
      const isHolidayLike = isWeekend || isFirstDay;

      return isHolidayLike;
    }
  ]
});

Внутри одной проверки возможно комбинировать бизнес-правила любой сложности, включая:

  • исключение выходных
  • блокировку определённых чисел месяца
  • ограничение сезонных периодов
  • зависимость от внешних данных

Отключение через предопределённые даты и функции

Flatpickr позволяет смешивать разные типы значений в disable, включая строки дат и функции.

flatpickr("#calendar", {
  disable: [
    "2026-01-01",
    "2026-12-31",
    function(date) {
      return date.getDay() === 6;
    }
  ]
});

При этом логика интерпретации следующая:

  • строковые даты отключаются точно по совпадению
  • функции применяются ко всем датам календаря
  • диапазоны могут добавляться отдельными объектами

Работа с локализацией и началом недели

Поскольку отображение календаря зависит от локали, важно учитывать смещение начала недели при визуальной интерпретации, однако getDay() всегда остаётся неизменным.

flatpickr("#calendar", {
  locale: "ru",
  weekStart: 1,
  disable: [
    function(date) {
      return date.getDay() === 0;
    }
  ]
});

Визуально неделя может начинаться с понедельника, но логика вычисления воскресенья остаётся фиксированной.

Производительность при большом диапазоне дат

При работе с крупными диапазонами дат функция disable вызывается для каждой отрисовываемой ячейки календаря. Это делает критически важной оптимизацию условий.

Неэффективный вариант:

disable: [
  function(date) {
    return JSON.stringify([0, 6]).includes(date.getDay());
  }
]

Оптимальный вариант:

const blocked = new Set([0, 6]);

flatpickr("#calendar", {
  disable: [
    function(date) {
      return blocked.has(date.getDay());
    }
  ]
});

Использование Set снижает сложность проверки до O(1).

Комбинация с пользовательскими правилами

В реальных сценариях отключение дней недели часто становится частью комплексной бизнес-логики.

const isWeekend = (d) => d.getDay() === 0 || d.getDay() === 6;
const isEndOfMonth = (d) => {
  const next = new Date(d);
  next.setDate(d.getDate() + 1);
  return next.getDate() === 1;
};

flatpickr("#calendar", {
  disable: [
    function(date) {
      return isWeekend(date) || isEndOfMonth(date);
    }
  ]
});

Такая структура повышает читаемость и упрощает сопровождение правил.

Обновление правил в зависимости от состояния приложения

При изменении состояния интерфейса правила отключения могут адаптироваться:

let mode = "default";

flatpickr("#calendar", {
  disable: [
    function(date) {
      if (mode === "strict") {
        return true;
      }

      if (mode === "weekdays-only") {
        return date.getDay() === 0 || date.getDay() === 6;
      }

      return false;
    }
  ]
});

Логика становится реактивной по отношению к внешним параметрам без пересоздания компонента.

Особенности поведения в пределах месяцев и навигации

Flatpickr пересчитывает доступность дат при каждом переходе между месяцами. Функция disable повторно применяется ко всем видимым ячейкам календаря, включая:

  • текущий месяц
  • предыдущий/следующий месяц (если отображаются)
  • даты вне диапазона текущего месяца

Это означает, что фильтрация дней недели является глобальной для всего диапазона отображения, а не локальной для одного месяца.

Оглавление