如何从daterangepicker读取值？

I have this daterangepicker runs on my local PHP site. Here is the code for HTML part

我有这个daterangepicker在我的本地PHP站点上运行。这是HTML部分的代码

<form role="form" class="form-inline" method="post" action="">

    <div id="reportrange" class="form-control">
         <i class="fa fa-calendar"></i>
         <span></span> 
         <b class="caret"></b>
    </div>

    <button class="btn btn-white" type="submit">Search</button>

</form>

Javascript part:

$('input[name="daterange"]').daterangepicker();

    $('#reportrange span').html(moment().subtract(29, 'days').format('MMMM D, YYYY') + ' - ' + moment().format('MMMM D, YYYY'));

    $('#reportrange').daterangepicker({
        autoApply: true,
        format: 'MM/DD/YYYY',
        startDate: moment().subtract(29, 'days'),
        endDate: moment(),
        minDate: '01/01/2012',
        maxDate: '12/31/2015',
        dateLimit: { days: 60 },
        showDropdowns: true,
        showWeekNumbers: true,
        timePicker: false,
        timePickerIncrement: 1,
        timePicker12Hour: true,
        ranges: {
            'Today': [moment(), moment()],
            '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')]
        },
        opens: 'right',
        drops: 'down',
        buttonClasses: ['btn', 'btn-sm'],
        applyClass: 'btn-primary',
        cancelClass: 'btn-default',
        separator: ' to ',
        locale: {
            applyLabel: 'Submit',
            cancelLabel: 'Cancel',
            fromLabel: 'From',
            toLabel: 'To',
            customRangeLabel: 'Custom',
            daysOfWeek: ['Su', 'Mo', 'Tu', 'We', 'Th', 'Fr','Sa'],
            monthNames: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'],
            firstDay: 1
        }
    }, function(start, end, label) {
            console.log(start.toISOString(), end.toISOString(), label);
            $('#reportrange span').html(start.format('MMMM D, YYYY') + ' - ' + end.format('MMMM D, YYYY'));
    });

I can select the date well, But no readable value on submit. Already follow this suggestion getting the value of daterangepicker but still no luck. Any helps is appreciated. Thanks.

我可以很好地选择日期,但提交时没有可读的价值。已经按照这个建议获得daterangepicker的价值,但仍然没有运气。任何帮助表示赞赏。谢谢。

3 个解决方案

#1

Found the solution here easy-to-use-bootstrap-date-range-picker

在这里找到了易于使用的解决方案 - bootstrap-date-range-picker

#2

The daterangepicker library will dynamically create an <input> tag with name="daterange". So, when you submit your form, the daterange form variable should contain the value you want. It will be formatted something like this:

daterangepicker库将动态创建一个名为=“daterange”的标记。因此,当您提交表单时,daterange表单变量应包含您想要的值。它的格式如下:

01/15/2015 - 02/15/2015

2015年1月15日 - 2015年2月15日

If that is not a format that you want, you could create two hidden input fields (one for start date and one for end date) and set their values whenever your date range is changed.

如果这不是您想要的格式,您可以创建两个隐藏的输入字段(一个用于开始日期,一个用于结束日期),并在更改日期范围时设置其值。

<input type="hidden" name="start">
<input type="hidden" name="end">

#3

$('#reportrange').data('daterangepicker').startDate;
$('#reportrange').data('daterangepicker').endDate;

This question solves it all.In my case the answer was not working because I was accessing the value before Declaring a date range picker. getting the value of daterangepicker bootstrap

这个问题解决了这一切。在我的情况下答案是行不通的,因为我在声明日期范围选择器之前访问了该值。获取daterangepicker引导程序的值

#1