jQuery datepicker允许特定日期

我有一个基本问题,我想我几乎找到了解决方案,但我不能说我做错了什么。

我有多个jQuery datepicker,但我不希望用户选择非工作日。

这是我到目前为止所做的:

function enableAllTheseDays(date) {
    var sdate = moment(date).format('YYYY-MM-DD');

    if ($.inArray(sdate,enabledDates) !== -1) {
        return [true];
    }
    console.log(date);
    return [false];
}

$('#newOrderDates').datepicker({
    todayHighlight: true,format: 'yy-mm-dd',multidate: true,startDate : new Date(),beforeShowDay: enableAllTheseDays
});

因此日期选择器将可以选择多个日期,而我不希望用户选择过去的日期和非工作日。

enabledDates数组如下所示:

jQuery datepicker允许特定日期

我不奇怪,控制台会显示非工作日,但是由于某些原因,用户仍然可以使用datepicker选择它们!我想错误是来自return [true]和return [false]造成的,但到目前为止,我还没有找到相关的文档来解决此问题。

jQuery datepicker允许特定日期

感谢您的帮助。

路易

power1234power 回答:jQuery datepicker允许特定日期

以下是引导日期选择器的示例,您可以根据要求限制或启用/禁用日期。

INSERT
SQL> create table table_a (column_a varchar2(20),column_b number);

Table created.

SQL> insert into table_a (column_a,column_b)
  2  select 'Body Number',68900000 + level - 1 column_b
  3  from dual
  4  connect by level <= 68999005 - 68900000 + 1;

99006 rows created.

SQL> select min(column_b),max(column_b) from table_a;

MIN(COLUMN_B) MAX(COLUMN_B)
------------- -------------
     68900000      68999005

SQL>
var enabledDates = new Array('2020-01-12','2020-01-16','2020-01-18','2020-01-30','2020-02-05','2020-02-10');

$(document).ready(function() {
  $("#newOrderDates").datepicker({
    todayHighlight: true,format: 'yyyy-mm-dd',multidate: true,startDate: new Date(),beforeShowDay: function(date) {
      var sdate = moment(date).format('YYYY-MM-DD');
      if ($.inArray(sdate,enabledDates) !== -1) {
        return {
          enabled: true
        }
      } else {
        return {
          enabled: false
        }
      }
    }
  });
});

,

这里是 jquery datepicker 的示例,您可以根据需要限制或启用/禁用日期。

var enabledDates = new Array('2020-01-12','2020-02-10');

$(document).ready(function() {
  $(function() {
    $("#newOrderDates").datepicker({
      todayHighlight: true,dateFormat: 'yy-mm-dd',beforeShowDay: enableAllTheseDays
    });
  });

  function enableAllTheseDays(date) {
    var sdate = moment(date).format('YYYY-MM-DD');

    if ($.inArray(sdate,enabledDates) !== -1) {
      return [true];
    }

    return [false];
  }
})
h1 {
  color: green;
}

.ui-datepicker {
  width: 12em;
}
<link href='https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/ui-lightness/jquery-ui.css' rel='stylesheet'>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js">
</script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js">
</script>
<script src="//cdnjs.cloudflare.com/ajax/libs/moment.js/2.10.3/moment.js"></script>

<input type="text" id="newOrderDates">

本文链接:https://www.f2er.com/2806400.html

大家都在问