Сравнение дат - дата окончания должна быть больше, чем дата начала

Question

Я не могу думать о логике реализации даты окончания, всегда превышающей дату начала. Вот мой код представления и есть два поля Event End и Event Start. Пробовал реализовать, как показано в Validate that end date is greater than start date with jQuery, но не удалось. Как это реализовать?

<div class="clearfix"></div> 
 
<div class="control-group form-group"> 
 

 
    <label class="control-label col-md-4" style="text-align:left">Event Start</label> 
 
    <div class="controls" style="margin-left:0px"> 
 

 
    <div class="col-md-3 date" data-date="12-02-2012" data-date-format="dd-mm-yyyy" data-date-viewmode="years"> 
 
     <input class="m-wrap col-md-11 m-ctrl-medium datepicker form-control" required="required" name="starttimedate" id="ed_starttimedate" type="text" value="<?php echo $_POST['starttime']?date('d-m-Y',$_POST['starttime']):date('d-m-Y'); ?> " /> 
 
     <!-- <span class="add-on"><i class="fa fa-calendar" style="margin-top:5px"></i></span> --> 
 
    </div> 
 
    <div class="col-md-1">&nbsp;</div> 
 
    <div class="col-md-3 bootstrap-timepicker-component"> 
 
     <input class="m-wrap col-md-11 m-ctrl-medium timepicker-default form-control" required="required" value="<?php echo date('h:i A',$_POST['starttime']);?>" name="starttimetime" id="ed_starttimetime" type="text" /> 
 
     <!-- <span class="add-on"><i class="fa fa-clock-o" style="margin-top:5px"></i></span>--> 
 
    </div> 
 

 
    <div class="clearfix"></div> 
 

 
    </div> 
 

 
</div> 
 
<div class="clearfix"></div> 
 
<div class="control-group form-group"> 
 
    <label class="control-label col-md-4" style="text-align:left">Event End</label> 
 
    <div class="controls "> 
 
    <div class="col-md-3 date" data-date="12-02-2012" data-date-format="dd-mm-yyyy" data-date-viewmode="years"> 
 
     <input class="m-wrap col-md-11 m-ctrl-medium datepicker form-control" required="required" name="endtimedate" id="ed_endtimedate" type="text" value="<?php echo $_POST['endtime']?date('d-m-Y',$_POST['endtime']):date('d-m-Y'); ?> " /> 
 
     <!--<span class="add-on"><i class="fa fa-calendar" style="margin-top:5px"></i></span>--> 
 
    </div> 
 
    <div class="col-md-1">&nbsp;</div> 
 
    <div class="col-md-3 bootstrap-timepicker-component"> 
 
     <input class="m-wrap col-md-11 m-ctrl-medium timepicker-default form-control" required="required" value="<?php echo date('h:i A',$_POST['endtime']);?>" name="endtimedatetime" id="ed_endtimedatetime" type="text" /> 
 
     <!-- <span class="add-on"><i class="fa fa-clock-o" style="margin-top:5px"></i></span>--> 
 
    </div> 
 
    </div>

SCRIPT IS:

<script> 
 
    $("#ed_endtimedate").change(function() { 
 
    var startDate = document.getElementById("ed_starttimedate").value; 
 
    var endDate = document.getElementById("ed_endtimedate").value; 
 

 
    if ((Date.parse(ed_endtimedate) <= Date.parse(ed_starttimedate))) { 
 
     alert("End date should be greater than Start date"); 
 
     document.getElementById("ed_endtimedate").value = ""; 
 
    } 
 
    }); 
 
</script>

Answer 1

В вашей если-случай, если вы на самом деле пытаются ссылаться на идентификаторы входных полей и не две переменные, которые вы определили. Произойдет ошибка, потому что скрипт попытается прочитать две переменные, которые не определены. Ниже затруднительного

<script> 
 
    $("#ed_endtimedate").change(function() { 
 
    var startDate = document.getElementById("ed_starttimedate").value; 
 
    var endDate = document.getElementById("ed_endtimedate").value; 
 

 
    if ((Date.parse(endDate) <= Date.parse(startDate))) { 
 
     alert("End date should be greater than Start date"); 
 
     document.getElementById("ed_endtimedate").value = ""; 
 
    } 
 
    }); 
 
</script>

После повторного чтения коды я вижу, что вы используете неверный формат для даты. Стандарт ISO для форматирования даты - yyyy-mm-dd, но вы используете dd-mm-yyyy.