如何将日期范围选择器从可见输入输出到单独的隐藏输入?

时间:2018-05-09 17:56:12

标签: jquery input daterangepicker

有人可以查看我的代码吗?我似乎无法让这个工作。我使用日期范围选择器,并且需要用户选择的主输入中出现的日期也输出到隐藏的输入字段中。我需要隐藏的字段格式为YYYY-MM-DD。

HTML

 <input type="text" class="main" name="maininput" id="datesearch">
 <input type="hidden" name="start" id="startdate">
 <input type="hidden" name="end" id="enddate">

JS

$(function() {
var start = moment().subtract(29, 'days');
var end = moment();


function cb(start, end) {
    $('#datesearch').html(start.format('YYYY/MM/DD') + ' - ' + end.format('YYYY/MM/DD'));
    $('#startdate').value = $('#datesearch').html(start.format('YYYY-MM-DD')).value;
    $('#enddate').value = $('#datesearch').html(end.format('YYYY-MM-DD')).value;
}

$('#datesearch').daterangepicker({
    startDate: start,
    endDate: end,
    timePicker: true,
    ranges: {
       'Today': [moment(), moment()],
       'This Month': [moment().startOf('month'), moment().endOf('month')],
        }



}, cb);

cb(start, end);

});

另外,当我提交时,我发现日历不会更新用户选择并始终默认返回startDate和endDate值...

1 个答案:

答案 0 :(得分:0)

$('#datesearch').on('apply.daterangepicker', function(ev, picker) {
  console.log(picker.startDate.format('YYYY-MM-DD'));
  console.log(picker.endDate.format('YYYY-MM-DD'));
});

参考Datepicker Range