Как получить дату после трех месяцев с помощью начальной загрузки datetimepicker?
Я использую jquery datetimepicker и у меня есть два элемента управления:
- От
- к
Я хочу получить после трехмесячного свидания в To
контроль по выбранной дате в From
контроль.
Что вы пытались:-
$(function () {
$('.datePicker').datetimepicker({
});
$('body').on('blur', '.pcFrom', function () {
var fromDate = $(this).val();
$('.pcTo').val(fromDate);
});
});
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.22.2/moment.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/eonasdan-bootstrap-datetimepicker/4.17.47/css/bootstrap-datetimepicker.css" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/eonasdan-bootstrap-datetimepicker/4.17.47/js/bootstrap-datetimepicker.min.js"></script>
<div class="form-group">
<label>From</label>
<input type="text" class="form-control datePicker pcFrom" data-date-format="MM-DD-YYYY">
</div>
<div class="form-group">
<label>To</label>
<input type="text" class="form-control pcTo">
</div>
1 ответ
Решение
Вам нужно будет преобразовать значение из средства выбора даты в Date()
а затем использовать .setMonth()
добавив нужное количество месяцев. Затем вам нужно будет переформатировать его снова в поле вывода.
$('.datePicker').datetimepicker();
$(document).on('blur', '.pcFrom', function() {
var fromDate = new Date($(this).val());
var after3Months = fromDate.setMonth(fromDate.getMonth()+3);
$('.pcTo').val("" + (fromDate.getMonth()+1) + "-" + fromDate.getDate() + "-" + fromDate.getFullYear());
});
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.22.2/moment.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/eonasdan-bootstrap-datetimepicker/4.17.47/css/bootstrap-datetimepicker.css" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/eonasdan-bootstrap-datetimepicker/4.17.47/js/bootstrap-datetimepicker.min.js"></script>
<div class="form-group">
<label>From</label>
<input type="text" class="form-control datePicker pcFrom" data-date-format="MM-DD-YYYY">
</div>
<div class="form-group">
<label>To</label>
<input type="text" class="form-control pcTo">
</div>