繁体   English   中英

日期选择器应仅在未来的日期中启用2年零6个月

[英]Date picker should be enabled only for 2 year and 6 months in future date in jquery

日期选择器中的日期只能从今天开始的未来2年和6个月启用,在该日期之后应禁用。(不应接受当前或过去的日期)

        $(document).ready(function () {
            $('.datepickerOne').datepicker({
                format: 'mm/dd/yyyy',
                endDate: '+0d',
                autoclose: true
            }).on("change", function () {
                $("#studentDetailsForm").bootstrapValidator('revalidateField', 'certification_date');
            })
        });

正如Surjit SD所说,请使用minDate和maxDate将其设置为今天之前不设置任何值,最长不超过30个月。 代码应类似于:

$(document).ready(function () {
    $('.datepickerOne').datepicker({
        format: 'mm/dd/yyyy',
        minDate: -0,
        maxDate: "+30M"
        autoclose: true
    }).on("change", function () {
        $("#studentDetailsForm").bootstrapValidator('revalidateField', 'certification_date');
    })
});

如果您正在使用jquery datepicker小部件,则它具有限制日期的选项。

使用minDate和maxDate选项限制可选日期的范围。

请参考Jquery https://jqueryui.com/datepicker/#min-max

$( ".selector" ).datepicker({
  minDate: new Date(2007, 1 - 1, 1)
});

如果您使用的是jQuery UI Datepicker:

看一下: jQuery UI mindatejQuery UI maxdate

好吧,您正在使用bootstrap-datepicker

因此,您使用了正确的选项endDate但在2年6个月的时间里,您需要此值:

endDate: '+910d'

在您的代码中:

$(document).ready(function() {
  $('.datepickerOne').datepicker({
    format: 'mm/dd/yyyy',
    endDate: '+910d',
    autoclose: true
  }).on("change", function() {
    $("#studentDetailsForm").bootstrapValidator('revalidateField', 'certification_date');
  })
});

注意:910天平均为2年6个月

 $(document).ready(function() { $('.datepickerOne').datepicker({ format: 'mm/dd/yyyy', endDate: '+910d', autoclose: true }); }); 
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.3.0/js/bootstrap-datepicker.js"></script> <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet" type="text/css" /> <link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.3.0/css/datepicker.css" rel="stylesheet" type="text/css" /> <input type="text" class="datepickerOne"> 

 $(document).ready(function() { var expireDate = new Date(); expireDate.setFullYear(expireDate.getFullYear() + 2); expireDate.setMonth(expireDate.getMonth() + 6) expireDate.setDate(expireDate.getDate() -1); $( "#expires" ).datepicker({ maxDate: expireDate, }); }) 
 <link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css"> <script src="https://code.jquery.com/jquery-1.12.4.js"></script> <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script> <input name="expires" type="text" id="expires" readonly/> 

我使用自定义函数以这种方式确定最大日期,您可以根据自己的逻辑确定哪些是有效日期。

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM