设置开始日期并在日历显示时自动启用结束日期的日期选择 (daterangepicker)

问题描述

我需要在日历显示时自动设置开始日期并启用结束日期的日期选择（daterangepicker）。

我的代码示例：

var Sunday = "Sun";
var Monday = "Mon";
var Tuesday = "Tues";
var Wednesday = "Wed";
var Thursday = "Thu";
var Friday = "Fri";
var Saturday = "Sat";
var apply = "apply";
var cancel = "cancel";
var from = "from";
var to = "to";
var January = "Jan";
var February = "Febr";
var march = "march";
var April = "April";
var May = "May";
var June = "June";
var July = "July";
var August = "August";
var September = "Sept";
var October = "October";
var November = "Nov";
var December = "Dece";

function DatePickerReturn() {
var min_date = new Date();
var max_date = new Date();
var numberOfDaysToAdd = 330;
max_date.setDate(max_date.getDate() + numberOfDaysToAdd);
$('#datetimepicker6,#datetimepicker7').daterangepicker({
    format: 'DD/MM/YYYY',//drops: 'auto',autoUpdateInput: false,autoclose: true,autoApply: true,minDate: min_date,maxDate: max_date,"locale": {
        "format": "MM/DD/YYYY","separator": " - ","applyLabel": apply,"cancelLabel": cancel,"fromLabel": from,"toLabel": to,"customrangeLabel": "Custom","daysOfWeek": [
            Sunday,Monday,Tuesday,Wednesday,Thursday,Friday,Saturday
        ],"monthNames": [
            January,February,march,April,May,June,July,August,September,October,November,December
        ],"firstDay": 0
    }
});
$("#datetimepicker6,#datetimepicker7").val('');
$('#datetimepicker6,#datetimepicker7').on('apply.daterangepicker',function(ev,picker) {
    // $(this).val(picker.startDate.format('DD/MM/YYYY') + ' - ' + picker.endDate.format('DD/MM/YYYY'));
    $("#datetimepicker6").val(picker.startDate.format('DD/MM/YYYY'));
    $("#datetimepicker7").val(picker.endDate.format('DD/MM/YYYY'));
    //change the selected date range of that picker
    $('#datetimepicker6').data('daterangepicker').setStartDate(picker.startDate);
    $('#datetimepicker6').data('daterangepicker').setEndDate(picker.endDate);
    $('#datetimepicker7').data('daterangepicker').setStartDate(picker.startDate);
    $('#datetimepicker7').data('daterangepicker').setEndDate(picker.endDate);
});
$('#datetimepicker6,#datetimepicker7').on('showCalendar.daterangepicker',picker) {
    picker.setStartDate(picker.startDate);
    picker.setEndDate(null);
    // picker.updateView();
    // console.log("datetimepicker: " + $("td.active.start-date").attr('id'))
    //if($(this).attr('id')=="datetimepicker7")
    //{
    if ($("#datetimepicker6 input").val() != "") {
        //alert("Yes");
        console.log($('td.active.start-date').text());
        setTimeout(function() {
            $('td.active.start-date').focus();
            $('td.active.start-date').click();
            console.log("Done");
        },10);
        //  $("td.active.start-date").hoverDate;
        //'mouseenter.daterangepicker','td.available'
        //$('td.active.start-date').focus();
        // $.proxy(this.hoverDate,$('td.active.start-date'))
    }
});
}
$(function() {
DatePickerReturn();
});

  <input type="text" id="datetimepicker6" value="" />
<input type="text" id="datetimepicker7" value="" />

i tried to trigger click on start date to enable selection automatically when calendar show using below code but it not working

    $('td.active.start-date').click();

Please can anyone help me with this?

[View image to see what I looking for][1]
 

    


  [1]: https://i.stack.imgur.com/cPpKp.png

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）