首页 > 解决方案 > 如何使用 date-picker bootstrap4 插件禁用每月 26 日到 30 日以及每个月的星期日

问题描述

因此,任务是禁用日历中从 26 日到 30 日以及所有星期日的日期。我正在使用 bootstrap4 插件来实现这一点。

其次,选择日期的选项将从今天的日期过去 2 天到接下来的 10 天。(-2 + 10)

例如:从今天 2020 年 5 月 25 日开始的日期现在用户可以选择从 (25 - 2) = 5 月 23 日到 (23 + 10) = 2020 年 6 月 10 日 {{不包括 26、27、28、29、30 和所有星期日} }

我想更改上述验证和对此代码的更改:

var date = new Date();

$('#divOutPutViewData').find(':text[id="' + data[i].CandidateID + '"]').datepicker({
    uiLibrary: 'bootstrap4',
    format: 'dd-mmm-yyyy',
    Value: date,
    minDate: date,
    //maxDate: new Date(),
    clearBtn: true });

$('#divOutPutViewData').find(':text[id="' + data[i].CandidateID + '"]')
    .val();

我正在尝试这段代码:

function LoadDatePicker() {
  debugger;

  var d = new Date();
  var firstDay = new Date();
  var n = d.getFullYear();
  var lastdate = "31/12/" + ((new Date()).getFullYear() + 1);
  var StartFromJan = new Date(new Date().getFullYear(), 0, 1);
  $('.date').datepicker({

    format: 'dd-mm-yyyy',
    autoclose: true,
    //startDate: firstDay,
    endDate: lastdate,
    todayHighlight: true,
    startDate: StartFromJan
    //startDate: "01-01-" + n,
  });

标签: javascripthtmljqueryasp.netdatepicker

解决方案


基于文档

https://bootstrap-datepicker.readthedocs.io/en/latest/options.html#daysofweekdisabled

https://bootstrap-datepicker.readthedocs.io/en/latest/options.html#beforeshowday

禁用所有星期天添加

daysOfWeekDisabled: '0', 

并禁用从 26 日到 30 日的所有日子,添加此挂钩

beforeShowDay: function(date) {
  if ((date.getDate() >= 26) && (date.getDay() <= 30)) {
    return [false]
  } else {
    return [true]
  }
}

推荐阅读