Невозможно выбрать дату до и после неактивной даты. - PullRequest
Новая
       58

Невозможно выбрать дату до и после неактивной даты.

0 голосов
/ 04 мая 2020

Я занимаюсь проектом, в котором я выбираю дату кредита и дату ввода в эксплуатацию. Теперь я сделал так, чтобы я не мог выбрать дату раньше, чем сегодня, и те, которые я дал в «датах», потому что они неактивны. А теперь вопрос: как сделать невозможным выбор даты до неактивной и после активной? Например, если я не могу выбрать дату аренды 6 мая и дату доставки 10 мая, потому что у меня уже есть другая аренда в середине? 

<!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>
...