Brak możliwości wyboru daty pomiędzy nieaktywnymi datami

pytanie zadane 4 maja 2020 w JavaScript przez siemasiema123.96 Początkujący (350 p.)

Witam.

Robię projekt, w którym wybieram datę wypożyczenia i datę oddania. Teraz mam zrobione tak, że nie mogę wybrać daty wcześniejszej niż dzisiejsza i tych, które mam podane w 'dates', bo są nieaktywne. I teraz pytanie: jak zrobić tak żeby nie było możliwe wybranie daty przed tymi nieaktywnymi i po aktywnych? Np żebym nie mógł wybrać daty wypożyczenia 6 maja i daty oddania 10 maja, bo po środku mam już inne wypożyczenie?

Oto mój kod:

<!DOCTYPE html>
<html>
<title>Web Page Design</title>
<head>
    <script src="https://code.jquery.com/jquery-2.2.4.js"></script>
    <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
    <link href="https://code.jquery.com/ui/1.11.3/themes/smoothness/jquery-ui.css" rel="stylesheet">
    <script type="text/javascript">
    var dates = ["2020-05-07","2020-05-08","2020-05-09"]
 
        function DisableDates(date) {
            var string = jQuery.datepicker.formatDate('yy-mm-dd', date);
            return [dates.indexOf(string) == -1];
        }
 
        $(document).ready(function () {
            var minDate = new Date();
            $("#rentDate").datepicker({
                showAnim: 'drop',
                numberOfMonth: 1,
                minDate: minDate,
                dateFormat: 'yy-mm-dd',
                beforeShowDay: DisableDates,
                onClose: function (selectedDate) {
                    $('#returnDate').datepicker("option", "minDate", selectedDate);
                }
            });
 
            $("#returnDate").datepicker({
                showAnim: 'drop',
                numberOfMonth: 1,
                minDate: minDate,
                dateFormat: 'yy-mm-dd',
                beforeShowDay: DisableDates,
                onClose: function (selectedDate) {
                    $('#rentDate').datepicker("option", "maxDate", selectedDate);
                }
            });
 
        });
 
</script>
</head>
<body>
 Data wypożyczenia: </br>
            <input type="text" id="rentDate" name="rentDate" placeholder="Data wypożyczenia" required>
            </br>
            Data zwrotu:
            </br>
            <input type="text" id="returnDate" name="returnDate" placeholder="Data zwrotu" required>
            </br>
</body>
</html>