2

ブートストラップdaterangepicker（テキスト入力）を使用して、特定の日付範囲をデフォルトとして設定するのを手伝ってください

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

4

7 に答える 7

1

入力フィールドの値属性に定義済みの日付を追加できます。お気に入り

<?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;?>">
于 2016-06-27T08:34:59.423 に答える
0

これは日付範囲用です... datarangepicker の Web サイトから例を取得し、必要に応じて cb(moment(), moment()) を変更します。最初の moment() は開始日を示し、2 つ目は終了日を示します。したがって、次の例は、今日から 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);
于 2016-03-11T23:16:31.303 に答える
0

datepicker を呼び出す前に入力値を設定します。

$(function () {
$("#inputDatepicker_start").val("01/05/2014");
$("#inputDatepicker_end").val("26/05/2014");
$("#datepicker").datepicker({ format: "dd/mm/yyyy" });
});
于 2017-10-04T22:18:42.483 に答える
-1

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);
    }
于 2016-09-23T05:30:22.367 に答える
-1

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"
});
于 2014-11-20T09:36:28.383 に答える