開始時間和結束時間的選擇

<div class="form-group">
        <label class="col-md-2 control-label">開始時間</label>
        <div class="input-group date form_datetime col-md-5" id="start_datetime" data-date="2018-10-16T05:25:07Z"
             data-date-format="yyyy-mm-dd HH:ii"
 
 data-link-field="dtp_input1">
            <input class="form-control" size="6" type="text"  id="start_datetime_input" name="start_datetime" value="" readonly>
            <span class="input-group-addon"><span class="glyphicon glyphicon-remove"></span></span>
            <
 
span class="input-group-addon"><span class="glyphicon glyphicon-th"></span></span>
        </div>
        <input type="hidden" id="dtp_input1" value=""/><br/>
    </div>

<div class="form-group">
        <label class="col-md-2 control-label">結束時間</
 
label>
        <div class="input-group date form_datetime col-md-5" id="end_datetime"  data-date="2018-10-16T05:25:07Z"
             data-date-format="yyyy-mm-dd HH:ii" data-link-field="dtp_input1">
            <input class="form-control" size="6" type="text" id="end_datetime_input" name="end_datetime" value="" readonly>
            <span class="input-group-addon"><span class="glyphicon glyphicon-remove"></span></span>
            <span class="input-group-addon"><span class="glyphicon glyphicon-th"></span></span>
        </div>
        <input type="hidden" id="dtp_input1" value=""/><br/>
        <span id='end_validator' style="color: red">hello</span>
</div>

js程式碼，主要是使用datetimepicker的 setStartDate和setEndDate兩個函式來設定顯示。

$('.form_datetime').datetimepicker({
        //language:  'fr',
        weekStart: 1,
        todayBtn: 1,
        autoclose: 1,
        todayHighlight: 1,
        startView: 2,
        forceParse: 0,
        showMeridian: 1
    });

    const dateOptions = {
        language: 'zh-CN',
        format: 'yyyy-mm-dd HH:ii',
        minuteStep: 1,
        autoclose: true
    };

    $('#start_datetime').datetimepicker(dateOptions).on('show', function () {
        const endTime = $('#end_datetime_input').val();
        console.log('endTime')
        console.log(endTime)
        if (endTime !== '') {
            $(this).datetimepicker('setEndDate', endTime);
        } else {
            $(this).datetimepicker('setEndDate', null);
        }
    });

    $('#end_datetime').datetimepicker(dateOptions).on('show', function () {
        const startTime = $('#start_datetime_input').val();
        if (startTime !== '') {
            $(this).datetimepicker('setStartDate', startTime);
        } else {
            $(this).datetimepicker('setStartDate', null);
        }
    });

　　效果如下：先選擇開始日期，再選擇結束日期時，會發現前邊的日期都變為灰色，不能選中