如何根据JQuery UI Datepicker中的条件排除禁用假日和周末

时间:2020-11-10 16:28:41

标签: jquery jquery-ui-datepicker

我当前正在使用JQuery-ui Datepicker作为开始日期和结束日期。

此外,我使用控制器发出的JSON请求进行查看,如图所示:

< script type = "text/javascript" >
  var holidayDays = [];
  var weekendInclusives;
  var holidayInclusives;
$(document).ready(function() {
  $(document).on('change', '#leave_type', function() {
    var air_id = $(this).val();

    var a = $(this).parent();

    // console.log("Its Change !");

    var op = "";

    $.ajax({
      type: 'get',
      url: '{{ route('
      get.leavecounts.all ') }}',
      data: {
        'id': air_id
      },
      dataType: 'json', //return data will be json
      // console.log("Its Change !");
      success: function(data) {
        $('#weekendinclusive').val(data.weekendinclusive);
        $('#holidayinclusive').val(data.holidayinclusive);
        holidayDays = data.nationalholidays;
      },
      error: function() {

      }
    });
  });
}); <
/script>

我已经能够使用下面的JQuery中的disabledays功能成功禁用假期和周末:

< script type = "text/javascript" >
  $(document).ready(function() {
    $("#leave_days").on('keyup blur', function(e) {
      var periodval = parseInt($("#leave_days").val());
      holidayDays = holidayDays;
      console.log(holidayDays);
      var startDate = $('.commencement_date');
      var endDate = $('.resumption_date');

      var dte = startDate.datepicker("getDate");
      dte.setDate(dte.getDate() + periodval);
      endDate.datepicker("setDate", dte);
    });

    function disabledays(date) {
      var ymd = date.getFullYear() + "-" + (date.getMonth() + 1) + "-" + date.getDate();
      //if u have to disable a list of day
      var removeDays = holidayDays;
      if ($.inArray(ymd, removeDays) >= 0) {
        return [false];
      } else {
        var day = date.getDay();
        return [(day == 1 || day == 2 || day == 3 || day == 4 || day == 5)];
      }
    }

    $('.commencement_date').datepicker({
      dateFormat: 'dd-mm-yy',
      changeMonth: true,
      changeYear: true,
      showAnim: 'slideDown',
      duration: 'fast',
      minDate: +1,
      setDate: new Date(),
      beforeShowDay: disabledays,
      yearRange: new Date().getFullYear() + ':' + new Date().getFullYear(),
    }).datepicker('setDate', '1');

    $('.resumption_date').datepicker({
      dateFormat: 'dd-mm-yy',
      changeMonth: true,
      changeYear: true,
      showAnim: 'slideDown',
      duration: 'fast',
      minDate: +1,
      beforeShowDay: disabledays,
      yearRange: new Date().getFullYear() + ':' + new Date().getFullYear(),
      enableOnReadonly: true,
      beforeShow: function(i) {
        if ($(i).attr('readonly')) {
          return false;
        }
      }
    });
  }); <
/script>

但是,在.commencement_date和.resumption_date日期选择器中,我只想在#weekendinclusive = 0时禁用周末,并且在#holidayinclusive = 0时仅禁用假期。

我该如何实现?

谢谢

0 个答案:

没有答案