Как автоматически изменить дату с помощью jQuery ровно на 1 месяц - PullRequest
Новая
       6

Как автоматически изменить дату с помощью jQuery ровно на 1 месяц

0 голосов
/ 01 октября 2018

Я использую jQuery , чтобы получить даты на моей веб-странице, которая отлично работает.Мое требование заключается в том, что если пользователь выбирает ValidFrom дату как 01/01/2019 (1 января 2018 года) или в этом случае любую случайную дату, то ValidTo дата должна автоматически увеличиться на 1 месяц .

Дата ValidTo должна измениться в соответствии с датой ValidFrom .

Ниже приведен мой код для того же: 

<script src="~/Scripts/jquery.datetimepicker.js"></script>
<script>
    $(document).ready(function () {
        $('#ValidFrom').datetimepicker({
            datepicker: true,
            timepicker: false,
            format: 'm/d/Y',
            step: 30,
            minDate: new Date()
        });
        $('#ValidTo').datetimepicker({
            datepicker: true,
            timepicker: false,
            format: 'm/d/Y',

            step: 30,
            minDate: new Date()
        });
    });

</script>

Ответы [ 2 ]

0 голосов
/ 17 октября 2018

Вот как должен выглядеть код. 

<script>
$(document).ready(function () {
    $('#ValidFrom').datetimepicker({
        datepicker: true,
        timepicker: false,
        format: 'm/d/Y',
        step: 30,
        minDate: new Date(),
        onChangeDateTime: function (dp, $input) {
            var date = new Date($input.val());
            date.setMonth(date.getMonth() + 1);
            date = (date.getMonth() + 1) + '/' + date.getDate() + '/' + date.getFullYear();
            $('#ValidTo').val(date);
        },

    });
    $('#ValidTo').datetimepicker({
        datepicker: true,
        timepicker: false,
        format: 'm/d/Y',
        step: 30,
        minDate: new Date()
    });
});

0 голосов
/ 01 октября 2018

FYI В этом примере используется плагин datepicker (действуйте соответственно).
Вы можете использовать событие datepicker onSelect jQuery-UI.

var config = config || {};


config.datepicker_defaults = {
  format: 'm/d/Y',
  minDate: new Date(),
};


jQuery(function($) {

  var $from = $('#ValidFrom'),
    $to = $('#ValidTo');

  $from.datepicker($.extend(config.datepicker_defaults, {
    onSelect: function() {
      var dateTo = new Date($(this).datepicker('getDate'));
      dateTo.setMonth(dateTo.getMonth() + 1);

      $to.datepicker('option', 'minDate', $(this).datepicker('getDate'));
      $to.datepicker('setDate', dateTo);
    }
  }));

  $to.datepicker(config.datepicker_defaults);

});
<link href="https://code.jquery.com/ui/1.12.1/themes/smoothness/jquery-ui.css" rel="stylesheet" type="text/css" />
<script src="https://code.jquery.com/jquery-3.1.0.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>


<input type="text" id="ValidFrom" readonly>
<input type="text" id="ValidTo" readonly>
...