在我的起始日期选择框中，我想显示当前会话日期范围之间的日期范围

Question

在我当前的登录会话中，我有

 var start_date = "<?php $this->session->userdata('start_date'); ?>";

 var end_date   = "<?php $this->session->userdata('end_date'); ?>";

例如 ：

$start_date = 2019-04-01 

$end_date   = 2020-03-31

在我的起始日期选择器框中，它选择会话结束日期我只想选择当前会话日期之间的日期。

我的代码：

<div class="row">

                 <div class="col-6">

                    <div class="form-group">

                       <label >From Date</label>

                       <input type="text" data-provide="datepicker" class="form-control" id="from_date_bk" 

                          name="from_date_bk" placeholder="DD/MM/YYYY" data-date-end-date="0d">

                    </div>

                 </div>

                <div class="col-6">

                  <div class="form-group">

                     <label >To Date</label>

                     <input type="text" data-provide="datepicker" class="form-control" id="to_date_bk" 

                        name="to_date_bk" data-date-end-date="0d">

                   </div>

                </div>

            </div>  

<script>

   $(document).ready(function() {

    var start_date = "<?php $this->session->userdata('start_date'); ?>";

    var end_date   = "<?php $this->session->userdata('end_date'); ?>";

    var date       = new Date();

    var today      = new Date(date.getFullYear(), date.getMonth(), date.getDate());

    $('#from_date_bk').datepicker({

            uiLibrary: 'bootstrap4',

            format:'dd/mm/yyyy',

              todayHighlight: true,

            autoclose: true,

            onClose: function( selectedDate )

            {

                $( "#to_date_bk" ).datepicker( "option", "minDate", selectedDate );

            }

        });

如何在当前会话日期之间选择一个日期。

Answer 1

你可以使用minDate并maxDate喜欢这个minDate: moment("01/04/2019"),maxDate: moment("31/03/2020"),

Answer 2

如果您不介意yy/mm/dd在输入中使用日期格式，则可以这样尝试：<script>&nbsp; &nbsp; <?php&nbsp; &nbsp; $start_date = $this->session->userdata('start_date'); // example output : '2019-04-01'&nbsp; &nbsp; $end_date&nbsp; &nbsp;= $this->session->userdata('end_date'); // example output : '2020-03-31'&nbsp; &nbsp; ?>&nbsp; &nbsp; $(document).ready(function() {&nbsp; &nbsp; &nbsp; &nbsp; var start_date = "<?php echo date("Y/m/d", strtotime($start_date)); ?>";&nbsp; &nbsp; &nbsp; &nbsp; var end_date = "<?php echo date("Y/m/d", strtotime($end_date)); ?>";&nbsp; &nbsp; &nbsp; &nbsp; var date = new Date();&nbsp; &nbsp; &nbsp; &nbsp; var today = date.getFullYear() + '/' + (date.getMonth() + 1) + '/' + date.getDate(); // month is 0 based index, so it have to be +1 to get current month, example output : '2019-09-07'&nbsp; &nbsp; &nbsp; &nbsp; $('#from_date_bk').datepicker({&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; uiLibrary: 'bootstrap4',&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; dateFormat: 'yy/mm/dd',&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; todayHighlight: true,&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; autoclose: true,&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; minDate: start_date,&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; maxDate: end_date,&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; onClose: function(selectedDate) {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; if (selectedDate) {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; $("#to_date_bk").datepicker("option", "minDate", selectedDate);&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; });&nbsp; &nbsp; &nbsp; &nbsp; $('#to_date_bk').datepicker({&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; uiLibrary: 'bootstrap4',&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; dateFormat: 'yy/mm/dd',&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; todayHighlight: true,&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; autoclose: true,&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; minDate: start_date,&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; maxDate: end_date,&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; onClose: function(selectedDate) {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; if (selectedDate) {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; $("#from_date_bk").datepicker("option", "maxDate", selectedDate);&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; });&nbsp; &nbsp; &nbsp; &nbsp; $('#to_date_bk').datepicker('setDate', today);&nbsp; &nbsp; });</script>这将设置：两个输入：一个范围从$start_date作为起始范围提供$end_date，默认为结束范围。#from_date_bkinput :填充了从$start_date到#to_date_bk之后的范围#to_date_bk。#to_date_bkinput :填充了从#from_date_bk到$end_date之后的范围#from_date_bk。我已经添加了if条件，onClose因此如果所选日期为空，它不会设置相反的日期选择器规则。