Question

如何以这种方式限制（禁用天数按钮）bootstrap-datepicker（不是jQuery Datapicker ）日历日期：

id_date_stop无法＆lt; id_date_start所以

如果我选择date_start为 06-05-2016 ，date_stop不能早于 06-05-2016 。

可以 2016年6月6日至2016年5月10日（今天的日期）。

我的HTML：

<div class="input-group date" data-provide="datepicker" data-date-end-date="0d">
    <input id="id_date_start" name="data_start" type="text">
    <div class="input-group-addon"></div>
</div>
<div class="input-group date" data-provide="datepicker" data-date-end-date="0d">
    <input id="id_date_stop" name="date_stop" type="text">
    <div class="input-group-addon"></div>
</div>

Answer 1

您可以将jQuery与bootstrap-datepicker中提供的方法结合使用来设置开始日期和结束日期。

示例代码看起来像这样

    $('#id_date_start').datepicker({autoClose: true}).on('changeDate',function(e) {

    $('#id_date_stop').datepicker({autoClose: true}).datepicker('setStartDate', e.date)
    .datepicker('setEndDate', new Date());

  })

此代码将设置＆＃39; date_stop＆＃39;的开始日期。 datepicker基于您选择的开始日期，并将结束日期设置为今天的日期。

我在方法调用之前使用行$('#id_date_start').datepicker({autoClose: true})，以确保初始化datepicker对象。这将确保方法正确启动。

以下是fiddle示例。

限制（禁用天数按钮）bootstrap-datepicker日历日期（date_stop可以＆lt; date_start）

1 个答案: