在我选择日期时间选择器上的时间和日期之前,请不要关闭下拉菜单

时间:2018-07-20 18:14:45

标签: jquery datetimepicker

我对jQuery的datetimepicker有问题。我需要下拉菜单在我同时选择时间和日期而不是仅选择日期之前关闭。我希望在选择时间之后,下拉菜单不应该关闭,因为选择日期时它不会关闭,所以我也希望在时间上也是如此。

无法解决的第二件事是:当我选择时间时,不应选择默认日期。我禁用了以前的日期,包括今天的日期。因此,当客户仅在时间选择上单击时,也会选择默认日期,也就是我今天不想选择的默认日期,并且已被禁用。

这是我的代码:

var now = new Date();

now.setDate(now.getDate()+1);

 $('#datetime').datetimepicker({ 
   formatTime:'g:i A',
 minDate:now,
 disabledDates: [now],

   allowTimes:[
  '10:00', '11:00', '12:00', 
  '13:00', '14:00', '15:00', '16:00', '17:00','18:00','19:00','20:00','21:00'
 ]

1 个答案:

答案 0 :(得分:1)

您可以使用datetimepicker的onClose。如果返回false,它将不会关闭。

这个例子并不完美,但您可以理解:)

var now = new Date();

now.setDate(now.getDate()+1);

function areBothFilled() {
  console.log( $('#datetime').val() );
  console.log( $('#datetime2').val() );
  
  if( $('#datetime').val() !== "" && $('#datetime').val() !== "" ) {
    return true;
  } else {
    return false;
  }
}

$('#datetime').datetimepicker({ 
    formatTime:'g:i A',
    minDate:now,
    disabledDates: [now],
    allowTimes:[
      '10:00', '11:00', '12:00', 
      '13:00', '14:00', '15:00', '16:00', '17:00','18:00','19:00','20:00','21:00'
    ],
    onClose: function(selectedDate) {
      return areBothFilled();
    }
});

$('#datetime2').datetimepicker({ 
   formatTime:'g:i A',
 minDate:now,
 disabledDates: [now],

   allowTimes:[
  '10:00', '11:00', '12:00', 
  '13:00', '14:00', '15:00', '16:00', '17:00','18:00','19:00','20:00','21:00'
 ],onClose: function(selectedDate) {
      return areBothFilled();
    }
 });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jquery-datetimepicker/2.5.20/jquery.datetimepicker.css"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-datetimepicker/2.5.20/jquery.datetimepicker.full.min.js"></script>

<input type="text" id="datetime"/>
<input type="text" id="datetime2"/>