1

我觉得这个问题相当简单。我正在尝试动态更改 Tempus Dominus Bootstrap Datetimepicker 上的选项。

特别是，我想在同一页面上更改另一个日期选择器时更改我的一个日期选择器上的选项。

// Initialisation. 
$(function () {
    $("#datetimepicker_start").datetimepicker({
        format: 'DD/MM/YYYY',
        date: '{{ widget.value }}',
        minDate: moment() // Today's date.
    });
  });

// Initialisation. 
$(function () {
    $("#datetimepicker_end").datetimepicker({
        format: 'DD/MM/YYYY',
        date: '{{ widget.value }}',
        minDate: moment() // Today's date.
    });
  });

// Document ready, set up event listener:
 $('#datetimepicker_start').on('change.datetimepicker', function() {
        $("#datetimepicker_end").datetimepicker({
            format: 'DD/MM/YYYY',
            date: moment()
            minDate:  $('#datetimepicker_start').val() // Trying to limit the mininmum date of this picker
                                                       // to the be value of the first.
        });
    });

这是一个经过编辑的示例。我目前正在使用我的模板逻辑动态插入初始日期选择器实例，因为它是我的 Web 框架加载的表单的一部分。

我似乎找不到即时更新这些选项的方法。明确地，我想要做的是链接两个日期选择器，以便用户不能选择早于开始的结束日期。我也试过

$("#datetimepicker_end).minDate = $('#datetimepicker_start).val() 甚至只是我在上一行中设置的值的 moment()。没变。朝着正确方向的任何一点都会很棒。

编辑：解决方案：

$('#datetimepicker_start').on('change.datetimepicker', function() {
        var new_min_date = $(this).datetimepicker('date');
        $("#datetimepicker_end").datetimepicker('minDate', new_min_date);
    });

奖励问题： 上述方法可以实现我想要实现的目标，但是在设置最小日期时，它不允许结束日期框保持空白（如果它已经是）。有谁知道如何实现这一目标？

4

0 回答 0