如何用JQuery比较两个DateTimePicker?

问题描述 投票:0回答:1

我想用jquery比较两个datetimepicker。如果start_date> end_date将警告“您的结束日期输入不正确”,该如何解决。我已经尝试过使用此代码,但是没有用。

    var startDate;
     $("#waktu_mulai").datetimepicker({
                 timepicker:true,
                 closeOnDateSelect:false,
                 closeOnTimeSelect: true,
                 initTime: true,
                 format: 'd-m-Y H:m',
                 minDate: 0,
                 roundTime: 'ceil',
                 onChangeDateTime: function(dp,$input){
                           startDate = $("#waktu_mulai").val();
                }
    });
    $("#waktu_akhir").datetimepicker({
                 timepicker:true,
                 closeOnDateSelect:false,
                 closeOnTimeSelect: true,
                 initTime: true,
                 format: 'd-m-Y H:m',
                 onClose: function(current_time, $input){
                        var endDate = $("#waktu_akhir").val();
                        if(startDate>endDate){
                               alert('Please select correct date');
                         }
                }
    });
jquery datetimepicker
1个回答
1
投票

在第二个输入框(onSelectDate)上使用onClose而不是waktu_akhir选项。

var startDate;
$("#waktu_mulai").datetimepicker({
  timepicker: true,
  closeOnDateSelect: false,
  closeOnTimeSelect: true,
  initTime: true,
  format: 'd-m-Y H:m',
  minDate: 0,
  roundTime: 'ceil',
  onChangeDateTime: function(dp, $input) {
    startDate = $("#waktu_mulai").val();
  }
});
$("#waktu_akhir").datetimepicker({
  timepicker: true,
  closeOnDateSelect: false,
  closeOnTimeSelect: true,
  initTime: true,
  format: 'd-m-Y H:m',
  onSelectDate:function(current_time, $input) {
    var endDate = $("#waktu_akhir").val();
    if (startDate > endDate) {
      alert('Please select correct date');
    }
  }
});
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.js"></script>
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/jquery-datetimepicker/2.5.20/jquery.datetimepicker.css">
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery-datetimepicker/2.5.20/jquery.datetimepicker.full.js"></script>

<input type="text" id="waktu_mulai" placeholder="Start Date"> -----
<input type="text" id="waktu_akhir" placeholder="End Date">

注意:不要忘记正确添加JavaScript库,并且JavaScript代码必须在document.ready中。

© www.soinside.com 2019 - 2024. All rights reserved.