引导上的init问题dateTimePicker的范围

问题描述 投票:0回答:1

有时候,我已经与预编译日期(在这些例子:2019年6月2日)的形式。

<div class='input-group date' id='datetimepicker1'>
    <input type='text' class="form-control" value="06/02/2019"/>
    <span class="input-group-addon">
        <span class="glyphicon glyphicon-calendar"></span>
    </span>
</div>
<div class='input-group date' id='datetimepicker2'>
    <input type='text' class="form-control" />
    <span class="input-group-addon">
        <span class="glyphicon glyphicon-calendar"></span>
    </span>
</div>

我得到引导的DateTimePicker一个问题:当值的页面加载已经存在,“堵”功能不工作:

$('#datetimepicker1').datetimepicker({
    format: 'DD/MM/YYYY'
});

$('#datetimepicker2').datetimepicker({
    format: 'DD/MM/YYYY',
    useCurrent: false //Important! See issue #1075
});

$("#datetimepicker1").on("dp.change", function (e) {
    $('#datetimepicker2').data("DateTimePicker").minDate(e.date);
});      

$("#datetimepicker2").on("dp.change", function (e) {
    $('#datetimepicker1').data("DateTimePicker").maxDate(e.date); //<-- it works only when I change date.
});

第一负载页面后,我会尽量选择qazxsw POI的日期,我想已经封锁日期2019年6月2日之前,但所有的日期都可以!它只有当我做输入字段进行更改工作。

见我的小提琴:datetimepicker2

javascript datetimepicker eonasdan-datetimepicker
1个回答
1
投票

按照https://jsfiddle.net/omerts/8jpmkcr5/1/,你需要使用Bootstrap Datetime PickerminDate同时初始化日期时间选择器。

maxDate
$(function () {    
         var datetime1 = $('#datetime1').val() != "" ? new Date($('#datetime1').val()) : false;
         var datetime2 = $('#datetime2').val() != "" ? new Date($('#datetime2').val()) : false;
                $('#datetimepicker1').datetimepicker({
                maxDate: datetime2
                });
                
                $('#datetimepicker2').datetimepicker({
                  useCurrent: false, //Important! See issue #1075
                  minDate: datetime1
                });
                
                $("#datetimepicker1").on("dp.change", function (e) {
                  $('#datetimepicker2').data("DateTimePicker").minDate(e.date);
                });      
                
                $("#datetimepicker2").on("dp.change", function (e) {
                    $('#datetimepicker1').data("DateTimePicker").maxDate(e.date);
                });
            });
© www.soinside.com 2019 - 2024. All rights reserved.