如何在Bootstrap日期选择器中获得动态的最大结束日期

问题描述

我正在网站上使用以下日期选择器选择开始日期和结束日期:

I am using the following date picker on my website for a start and end date selection:

https://bootstrap-datepicker.readthedocs.org/en/latest/index.html

规则是:

• 开始日期可以是今天到+ 30天之间，
• 结束日期不得晚于所选开始日期的1年

因此，在加载表单时，我将endDate选项设置为"+ 1y -1d"，效果很好.但是，例如，如果客户选择的开始日期为+30天，则我需要在第二个字段上使用endDate选项将其再次扩展为当前开始日期+ 1y -1d".

So when the form loads, I've set the endDate option to "+1y -1d" which works great. But if the customer picks a start date of +30 days for example, I need the endDate option on the second field to extend to "current start date +1y -1d" again.

我已经启动了代码，但真的不确定如何实现此目标:

I've started the code but really not sure how to acheive this:

<script type="text/javascript">
    $(function() {

        $(".startdate").datepicker({
            format: 'd MM yyyy',
            startDate: '+0d',
            endDate: '+30d',
            autoclose: true,
            startView: 0,
            minViewMode: 0,
            todayHighlight: true,
            orientation: "top"
        });
        $(".enddate").datepicker({
            format: 'd MM yyyy',
            startDate: '+1d',
            endDate: '+1y -1d',
            autoclose: true,
            startView: 0,
            minViewMode: 0,
            todayHighlight: true,
            orientation: "top"
        });

        $("#startdate").change(function() {

            var startdate = new Date (  $("#startdate").val() ) ;
            //alert(startdate);
            var newendatemaximum;

            $(".enddate").datepicker({
                endDate: ???????
            });
        });

    });
</script>

进行中解决方案:

$(".startdate").change(function() {
            //alert("start date change");
            var newendatemaximum = new Date (  $(".startdate").val() ) ;
            newendatemaximum.setYear(newendatemaximum.getFullYear() + 1);
            alert(newendatemaximum);
            $(".enddate").datepicker("option", "endDate", newendatemaximum);
        });

推荐答案

您不必使用json来设置datepicker选项.您可以直接设置它们.一旦有了要用作JavaScript日期的新的最大日期，就可以直接设置该选项:

You don't have to use json to set datepicker options. You can set them directly. Once you have the new max date that you want to use as a javascript date, you can just set that option directly:

    $("#startdate").change(function() {
        var newendatemaximum = new Date (  $("#startdate").val() ) ;
        newendatemaximum.setYear(newendatemaximum.getFullYear() + 1);
        $(".enddate").datepicker("option", "endDate", newendatemaximum);
    });

这篇关于如何在Bootstrap日期选择器中获得动态的最大结束日期的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！