I have these two calendar pickers that chooses the date for you, one for arrival and one of departed.
If the user chooses a day in departed calendar that is earlier than the one in arrival calendar, the calendar picker should be either disabled or when choosen - ignore it.
For example: arrival is 2017-03-08, choosen and read in the textbox and same for departed. If I try to pick 2017-03-07 for departed, it should not allow it and not be read in the textbox.
How is this possible with javascript/jquery?
My code:
var CalendarTwo;
function onPopupTxtArrivalDateChanged(sender) { //Function that reads arrival date
var txtArrival = $("#txtArrivalDate");
var date = new Date(sender.getSelectedDate());
var textDate = date.getFullYear() + "-" + (date.getMonth() <= 9 ? "0" + (date.getMonth() + 1)
: (date.getMonth() + 1)) + "-" + (date.getDate() <= 9 ? "0" + date.getDate() : date.getDate());
txtArrival.val(textDate);
onChange(sender, txtArrival, $("#txtDepartureDate")[0], CalendarTwo);
}
function onPopupTxtDepartureDateChanged(sender) { //Function that reads departed date
var txtDeparture = $("#txtDepartureDate");
var date = new Date(sender.getSelectedDate());
var textDate = date.getFullYear() + "-" + (date.getMonth() <= 9 ? "0" + (date.getMonth() + 1)
: (date.getMonth() + 1)) + "-" + (date.getDate() <= 9 ? "0" + date.getDate() : date.getDate());
CalendarTwo = sender;
txtDeparture.val(textDate);
}
function onChange(sender, txt, departed, calendarTwo) { //Function that checks that arrival date and departed is equal
var txtDate = $(txt).val();
var date = new Date(txtDate);
if (departed != undefined) {
CalendarTwo = calendarTwo;
var departedDate = new Date($(departed).val());
if (departedDate < date) {
calendarTwo.setSelectedDate(date);
departed.value = txtDate;
}
}
sender.SetSelectedDate(date);
}