daterangepicker auto submit

<div class="dateForm">
            <form id="dateForm">
    <?php echo "Showing results for date range: " . $mindate . " - " .$maxdate; ?>
    <div class="form-row align-items-center">
      <div class="col-auto">
        <div class="input-group">
          <div class="input-group-prepend">
            <div class="input-group-text">
              <i class="fa fa-calendar"></i>
            </div>
          </div>
          <input type="hidden" name="datemin">
          <input type="hidden" name="datemax">
          <input type="text" class="form-control mb-2 date_range" id="inlineFormInput" placeholder="onchange()" size="25" aria-label="date" aria-describedby="basic-addon1">
        </div>
      </div>
      <div class="col-auto">
        <button name="submit" type="submit" class="btn btn-primary dateSubmit">Filter Date</button>
      </div>
  </div>
  </form>


  <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')]
   },

   });

   $('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');

   });


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


  </script>