I have to validate the start time and end time whether the entered value in the text box is between the given value. It is working if the start time and end time are on the same day but if the end date is different then the validation fails. I have seen many other links on StackOverflow but it is not working.
How to check if one DateTime is later than another in javascript
How can I compare two time strings in the format HH:MM:SS?
How to check if one DateTime is later than another in javascript
<html>
<script language="javascript">
jQuery(document).on('change',".timepicker",function(){
var selectedTime = new Date("November 13, 2018 " + jQuery(this).val());
var startLimit = new Date("November 13, 2018 " + jQuery(this).data('starttime'));
var endLimit = new Date("November 13, 2018 " + jQuery(this).data('endtime'));
var start_time_val = new Date("November 13, 2018 " + $("input[name=start_time]").val());
var end_time_val = new Date("November 13, 2018 " + $("input[name=end_time]").val());
var elementName = jQuery(this).attr('name');
var valid = moment(jQuery(this).val(), "H:mm a", true).isValid();
var time = new Date("November 13, 2018 " + selectedTime);
jQuery(this).next('span.error').text('');
var error_msg = jQuery(this).data('erro_msg');
if(valid){
if(elementName == 'start_time'){
if(selectedTime >= startLimit && endLimit > selectedTime){
console.log("selected Time less than start limit");
}else{
console.log("selected Time is less than start limit");
jQuery(this).next('span.error').text(error_msg);
}
var endTimeSelected = jQuery(this).next('input').val();
}else if(elementName == 'end_time'){
if(selectedTime >= startLimit && endLimit > selectedTime){
}else{
jQuery(this).next('span.error').text(error_msg);
}
var endTimeSelected = jQuery(this).next('input').val();
}else if(elementName == 'end_time'){
if(selectedTime <= endLimit && selectedTime <= endLimit){
}
else{
jQuery(this).next('span.error').text(error_msg);
}
var startTimeSelected = jQuery(this).prev('input.timepicker').val();
}
}else{
jQuery(this).next('span.error').text(error_msg);
}
});
</script>
<input type="text" name="start_time" value="6:15 AM" class="form-control timepicker" autocomplete="off" requried="1" data-starttime="6:00 AM" data-endtime="12:00 PM" data-erro_msg="Please select time between 6:00 AM-12:00 PM">
<input type="text" name="end_time" value="7:15 AM" class="form-control timepicker" autocomplete="off" requried="1" data-starttime="6:00 AM" data-endtime="12:00 PM" data-erro_msg="Please select time between 6:00 AM-12:00 PM">
</html>
