Автозаполнение формы с данными даты из daterangepicker

Question

У меня этот скрипт почти работает. Что я хочу, чтобы при выборе даты, отправить форму автоматически с желаемыми данными. Этот скрипт в настоящее время разбивает даты и помещает их в скрытое поле ввода. Затем он ищет в БД и отображает результаты. Просто, верно.

Я читал всю ночь и понял, что это так. У меня проблема в том, что форма отправляет, но не включает данные.

<script>
$('input.date_range').daterangepicker({
  "alwaysShowCalendars": true,
  "showDropdowns": true,
  autoApply: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')]
 },



 });

$('form').submit(function (ev, picker) {
    [startDate, endDate] = $('.date_range').val().split(' - ');
    $(this).find('input[name="datemin"]').val(startDate);
    $(this).find('input[name="datemax"]').val(endDate);
});

$("input.date_range").change(function() {
    console.log($("input.date_range").val());
    $('form').delay(200).submit();
});

Эта часть здесь $("input.date_range").change(function() { console.log($("input.date_range").val()); $('form').delay(200).submit(); }); отправляет форму просто отлично. Просто данные не отправляются.

Я попробовал это так:

$("input.date_range").change(function() {
$('form').submit(function (ev, picker) {
    [startDate, endDate] = $('.date_range').val().split(' - ');
    $(this).find('input[name="datemin"]').val(startDate);
    $(this).find('input[name="datemax"]').val(endDate);
});

    console.log($("input.date_range").val());
    $('form').delay(200).submit();
});

Но это не работает. Диапазон дат отправляется на консоль, хотя.

Я знаю, что я близко. Просто чего-то здесь не хватает. Любая помощь приветствуется.

Ответы на тесты:

$('input.date_range').daterangepicker(
  // Options
  {
    "alwaysShowCalendars": true,
    "showDropdowns": true,
    autoApply: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')]
    }
  },
  // Callback
  function form_submit(){
    $('form').submit(function (ev, picker) {
        [startDate, endDate] = $('.date_range').val().split(' - ');
       $(this).find('input[name="datemin"]').val(startDate);
       $(this).find('input[name="datemax"]').val(endDate);
    });
}
$("input.date_range").change(function() {

    console.log($("input.date_range").val());
    $('form').trigger('submit');
});
  }
);

Выше не работает

Это также не работает. Он отправляет, но данные не передаются в поля ввода.

$('input.date_range').daterangepicker(
  // Options
  {
    "alwaysShowCalendars": true,
    "showDropdowns": true,
    autoApply: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')]
    }
  },
  // Callback
  function(start, end){ // start, end being the values of date range
      $(this).find('input[name="datemin"]').val(start);
      $(this).find('input[name="datemax"]').val(end);

      $('form').delay(200).submit(); // You can remove the delay too
  }
);

Я пытаюсь достичь следующего без нажатия кнопки «Отправить». https://jsfiddle.net/4mk3s5d6/1/

Answer 1

обновлено:

$('input.date_range').change(function (picker) {
    [startDate, endDate] = $(this).val().split(' - ');
    $('#dateForm').find('input[name="datemin"]').val(startDate);
    $('#dateForm').find('input[name="datemax"]').val(endDate);
    $('.dateSubmit').trigger('click');

});