jQuery DatePicker для подсчета дней с сегодняшнего дня - PullRequest
Новая
       12

jQuery DatePicker для подсчета дней с сегодняшнего дня

1 голос
/ 20 апреля 2020

У меня есть этот код, он подсчитывает дни между двумя датами с помощью jqueryUI datepicker.

Как мне полностью избавиться от первого ввода и просто считать дни с сегодняшнего дня? 

function showDays() {
    var start = $('#arr_date').datepicker('getDate');
    var end = $('#dep_date').datepicker('getDate');
    if (!start || !end) return;
    var days = (end - start) / 1000 / 60 / 60 / 24;
    $('#num_nights').val(days);
}

$("#arr_date").datepicker({
    dateFormat: 'dd-mm-yy',
    onSelect: showDays
});
$("#dep_date").datepicker({
    dateFormat: 'dd-mm-yy',
    onSelect: showDays
});
<link href="https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css" rel="stylesheet"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>

<input type="text" id="arr_date">
<input type="text" id="dep_date">
<input type="text" id="num_nights" disabled>

1 Ответ

1 голос
/ 20 апреля 2020

Используйте new Date() и установите его часы, минуты, секунды равными 0 в соответствии с форматом выбора даты. Также используйте Math.round() на разнице.

Тогда вы можете рассчитать, как показано ниже: 

function showDays() {
    var start = new Date()
    start.setHours(0);
    start.setMinutes(0);
    start.setSeconds(0);
    
    var end = $('#dep_date').datepicker('getDate');
    if (!start || !end) return;
    var days = Math.round((end - start) / 1000 / 60 / 60 / 24);
    $('#num_nights').val(days);
}

$("#dep_date").datepicker({
    dateFormat: 'dd-mm-yy',
    onSelect: showDays
});
<link href="https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css" rel="stylesheet"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>

<input type="text" id="dep_date">
<input type="text" id="num_nights" disabled>
...