Я использую bootstrap daterangepicker, как предопределить диапазон дат по умолчанию?

Я только что попытался добавить предопределенные даты в атрибут значения. Он работает так, как я хотел. Спасибо, ребята, за помощь.

<input type="text" class="form-control pull-right" id="trvlreqprd" name="trvlreqprd" value="<?php echo "2014/11/05 - 2014/11/12"; ?>" placeholder="Click here to Choose Date">

Вы можете добавить предопределенную дату в атрибут значения поля ввода. Нравиться

<?php 
  $date_range = "2014/11/05 - 2014/11/12";
?>


<input type="text" class="form-control pull-right" id="trvlreqprd" name="trvlreqprd" placeholder="Click here to Choose Date" value="<?php echo $date_range;?>">

это для диапазона дат... Получите пример с веб-сайта datarangepicker и измените cb(moment(), moment()) в зависимости от ваших потребностей. Первый момент () даст дату начала, а второй даст вам дату окончания. Таким образом, следующий пример начнется через 18 дней с сегодняшнего дня и закончится сегодня.

 cb(moment().subtract(18,'days'), moment());

    $('#reportrange').daterangepicker({
            "startDate": moment(),
            "endDate": moment(),
            "autoApply": true,
            "opens": "center",
            "buttonClasses": "btn-info",
            ranges: {
                'Today': [moment(), moment()],
                'Yesterday': [moment().subtract(1, 'days'), moment().subtract(1, 'days')],
                'Last 7 Days': [moment().subtract(6, 'days'), moment()],                   
                'This Month': [moment().startOf('month'), moment().endOf('month')]                   
            }
        }, cb);

установить входные значения до вызова datepicker.

$(function () {
$("#inputDatepicker_start").val("01/05/2014");
$("#inputDatepicker_end").val("26/05/2014");
$("#datepicker").datepicker({ format: "dd/mm/yyyy" });
});

Это единственное, что сработало для меня:

$("#trvlreqprd").val("01/01/2019 - 01/20/2019");
$("#trvlreqprd").keyup();

скопировано из здесь и посетите jsfiddle

 <div class="input-daterange" id="datepicker">
        <div class="input-group">
            <input type="text" class="input-small form-control" name="start" />
            <span class="input-group-addon">to</span>
            <input type="text" class="input-small form-control" name="end" />
        </div>
    </div>

JS

$('.input-daterange').datepicker({});

ввод между предопределенным диапазоном дат

$('.input-daterange').datepicker({
    startDate: "01/11/2014",
    endDate: "10/01/2015"
});

HTML-часть

    <div id="report-date-range" class="pull-right" style="background: #fff; cursor: pointer; padding: 5px 10px; border: 1px solid #ccc; width: 100%">
        <i class="glyphicon glyphicon-calendar fa fa-calendar"></i>&nbsp;
        <span></span> <b class="caret"></b>
    </div>

Javascript

    function updateLabel(start, end, label) {
        if (label === 'Custom Range') {
            $("#report-date-range span").html(start.format('MMMM D, YYYY') + ' - ' + end.format('MMMM D, YYYY'));
        } else {
            $("#report-date-range span").html(label);
        }
    }

    $("#report-date-range").daterangepicker({
        startDate: moment().startOf('day'),
        endDate: moment().endOf('day'),
        opens: "right",
        drops: "down",
        ranges: {
            'Today': [moment().startOf('day'), moment().endOf('day')],
            'Yesterday': [moment().subtract(1, 'days'), moment().subtract(1, 'days')],
            'Last 7 Days': [moment().subtract(6, 'days'), moment()],
            'Last 30 Days': [moment().subtract(29, 'days'), moment()],
            'This Month': [moment().startOf('month'), moment().endOf('month')],
            'Last Month': [moment().subtract(1, 'month').startOf('month'), moment().subtract(1, 'month').endOf('month')]
        }
    }, updateLabel);

    // Set the default value
    var datepicker = $("#report-date-range").data('daterangepicker');
    var initialSel = 'This Month';   // Or something else
    if (initialSel && datepicker.ranges && datepicker.ranges[initialSel]) {
        var range = datepicker.ranges[initialSel];
        datepicker.chosenLabel = initialSel;
        datepicker.setStartDate(range[0]);
        datepicker.setEndDate(range[1]);
        updateLabel(datepicker.startDate, datepicker.endDate, datepicker.chosenLabel);
    } else {
        datepicker.chosenLabel = 'Today';
        updateLabel(datepicker.startDate, datepicker.endDate, datepicker.chosenLabel);
    }