从一个bootstrap日期时间选择器和镜像到另一个的日期添加天数？

Question

我使用Bootstrap Date Time Picker (http://www.malot.fr/bootstrap-datetimepicker/)来允许用户在一个字段中选择日期和时间，然后需要在第二个字段中推荐初始选择的日期/时间后21天的日期。

我想知道如何像这样将一个字段“镜像”到另一个字段，但是添加X天？文档中有一个允许镜像的功能，但我不知道如何使用它来添加days (http://www.malot.fr/bootstrap-datetimepicker/demo.php -请参阅镜像字段演示)。

例如，获取使用字段A的日期时间选择器选择的日期，并将其镜像到字段B‘但是’将该日期添加21天，并将其用作B字段的默认日期？

Answer 1

在mccannf的一些正确方向上，我让它工作了，下面是我完成的代码片段：

var pickerOptsGeneral = {
    format: "dd/mm/yyyy",
    autoclose: true,
    minView: 2,
    maxView: 2
};
$("input.datepicker").datetimepicker(pickerOptsGeneral).on('changeDate', function(ev){
    if ($(this).hasClass('linked')) {
        // Get field name
        var startField = this.name;
        var endField = startField.replace("Start", "End");
        // Get start date and add 21 days
        endDate = new Date(ev.date);
        endDate.setDate(endDate.getDate() + 21);
        endDateString = ('0' + endDate.getDate()).slice(-2) + '/'
                        + ('0' + (endDate.getMonth()+1)).slice(-2) + '/'
                        + endDate.getFullYear();
        // Set end date
        $('input[name='+endField+']').val(endDateString);
    }
});

Answer 2

使用下面提供的代码mccannf，我现在得到的是：

var pickerOptsGeneral = {
    format: "dd/mm/yyyy",
    autoclose: true,
    minView: 2,
    maxView: 2
};
$("input.datepicker").datetimepicker(pickerOptsGeneral).on('changeDate', function(ev){

    if ($(this).hasClass('linked')) {

        var startfield = this.name;
        var endfield = startfield.replace("Start", "End");
        var startDate = (new Date(ev.date)) + 21;

        console.log(startDate);

        endfield.val(startDate.toISOString());
        endfield.datetimepicker('update');

    }

});

和我的标记：

<input type="text" placeholder="00/00/0000" value="" id="pStartDate1" name="fpStartDate1" maxlength="10" class="datepicker linked">

​

我试图创建一个这样的小提琴，但惨败！:/

当我在屏幕上回显'StartDate‘时，它显示为：

Tue Jul 02 2013 10:16:24 GMT+0100 (英国标准时间)21

我猜这可能是问题的原因，这看起来不像是一个可以以任何方式转置为有效日期的值。：?

Answer 3

尝试如下所示：

var pickerOptsGeneral = {
    format: "dd/mm/yyyy",
    autoclose: true,
    minView: 2,
    maxView: 2
};
$('#firstDate')
  .datetimepicker(pickerOptsGeneral)
  .on('changeDate', function(ev){
     var oldDate = new Date(ev.date);
     var newDate = new Date();
     newDate.setDate(oldDate.getDate() + 21);

     secondDate.val(newDate.getDate()+"/"+(newDate.getMonth()+1)+"/"+newDate.getFullYear());
     secondDate.datetimepicker('update');
});
var secondDate = $('#secondDate').datetimepicker(pickerOptsGeneral);

Fiddle here