Question

我的页面上有两个基本的bootstrap datepicker日历。我试图了解如何根据我在1号日历上选择的日期使用changeDate事件来设置2号日历的日期。我想在第一个日历月之前三个月设定日期。

以下是日历的HTML：

<div class="profile-info-row">
                            <div class="profile-info-name"> Date of Birth *</div>
                            <div class="profile-info-value">
                                <div id="sandbox-container">
                                    <span class="input-icon input-icon-right">
                                        <input type="text" type="text" name="dob" id="dob" class="form-control">
                                        <i class="ace-icon fa fa-calendar blue"></i>
                                    </span>
                                </div>
                            </div>
                        </div>

以下是日历脚本：

<script type="text/javascript">
            //datepicker plugin
        $('#sandbox-container input').datepicker({
            format: "dd-mm-yyyy",
            todayBtn: "linked",
            todayHighlight: true,
            weekStart: 1,
            autoclose: true
        });

编辑：这个问题是关于BOOTSTRAP datepicker，而不是JQUERY。我认为这是大多数问题中常见的误解

Answer 1

//datepicker plugin
$('#sandbox-container input').datepicker({
  format: "dd-mm-yyyy",
  todayBtn: "linked",
  todayHighlight: true,
  weekStart: 1,
  autoclose: true
}).on('changeDate', function(e) {
  // `e` here contains the extra attributes
  var newDate = new Date(e.date.setMonth(e.date.getMonth()+3));
  $('#second-sandbox-container input').datepicker('setDate', newDate);
});

http://bootstrap-datepicker.readthedocs.org/en/latest/events.html#changedate
http://bootstrap-datepicker.readthedocs.org/en/latest/methods.html#setdate

使用同一页面上另一个日历的日期更改bootstrap datepicker日历中的日期？

1 个答案: