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

Question

Помогите мне установить определенный диапазон дат, как по умолчанию с помощью начальной загрузки daterangepicker (Text Input)

<input type="text" class="form-control pull-right" id="trvlreqprd" name="trvlreqprd" placeholder="Click here to Choose Date"> 

JS:

$('#trvlreqprd').daterangepicker(); 

мне нужен текст, поданный быть заполнены заранее определенной даты. (Например: 2014/11/05 - 2014/11/12)

Бутстрап Подробно

---

файла: бутстраповские-datepicker.js

Репо: https://github.com/eternicode/bootstrap-datepicker/

Answer 1

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

<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"> 

Answer 2

скопировано из here и находится на 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" 
}); 

Answer 3

это для диапазона дат ... Получить пример с веб-сайта datarangepicker и изменил Cb (момент(), момент()), основанный на вашей потребности. Первый момент() даст дату начала, а второй даст вам дату окончания. Итак, следующий пример начнется через 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); 

Answer 4

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

<?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;?>"> 

Answer 5

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); 
    } 

Answer 6

набор входных значений перед вызовом DatePicker.

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