Включить конкретные даты в загрузчике DatePicker - PullRequest
Новая
       18

Включить конкретные даты в загрузчике DatePicker

1 голос
/ 17 мая 2019

У меня есть загрузчик даты начальной загрузки (https://github.com/uxsolutions/bootstrap-datepicker) на моем веб-сайте, и у меня есть массив дней, которые я хочу включить и отключить все другие даты в средстве выбора даты. Как я могу кодировать это?

Как я могу передать это? 

var enableDays = "24-07-2019, 20-08-2019, 22-08-2019, 13-09-2019"

$(function () {
    $('#deliveryDate').datepicker({
        maxViewMode: 2,
        weekStart: 1,
        startDate: '+1d',
        autoclose: true,
        todayHighlight: true,
        format: "dd-mm-yyyy", 
        clearBtn: true,
        language: form.UILanguage(),
        autoclose: true,
    }) 
});

1 Ответ

1 голос
/ 17 мая 2019

В документах Bootstrap Datepicker вы можете найти параметр beforeShowDay.

Вы можете определить функцию, которая будет возвращать {enabled: false} для каждого дня, который не включен вданный список.

Вот полная реализация: 

//we start with splitting the provided string into an array
var enableDays = "24-07-2019, 20-08-2019, 22-08-2019, 13-09-2019".split(', ')

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 day + "-" + month + "-" + d.getFullYear()
}

$(function () {
  $("#deliveryDate").datepicker({ 
        maxViewMode: 2,
        weekStart: 1,
        startDate: "+1d",
        beforeShowDay: function(date){
          if (enableDays.indexOf(formatDate(date)) < 0)
            return {
              enabled: false
            }
          else
            return {
              enabled: true
            }
        },
        todayHighlight: true,
        format: "dd-mm-yyyy", 
        clearBtn: true,
        autoclose: true
  })
});

Поскольку функциональность форматирования даты в чистом JS ограничена, я написал функцию, которая возвращает строку в формате dd-mm-yyyy.Не стесняйтесь использовать любую библиотеку манипуляций с датами (например, moment.js ).

...