Как получить дату после трех месяцев с помощью начальной загрузки datetimepicker? - PullRequest
Новая
       100

Как получить дату после трех месяцев с помощью начальной загрузки datetimepicker?

0 голосов
/ 06 декабря 2018

Я использую jquery datetimepicker и у меня есть два элемента управления:

  1. С
  2. До

Я хочу получить после трехмесячной даты в 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 Ответ

0 голосов
/ 06 декабря 2018

Вам нужно будет преобразовать значение из указателя даты в 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>
...