I'm filtering by date range using datatables js.

My range filtering works well if the dates in the table are in YYYY/MM/DD format.

 <div class="input-group my-3">
  <input class="form-control" type="date" id="min" name="min">
  <input class="form-control" type="date" id="max" name="max">
 </div>

Filter code:

 $('#min, #max').on('change', function () {
  $.fn.dataTable.ext.search.push(
    function( settings, data, dataIndex ) {
      var min = new Date($('#min').val());
      var max = new Date($('#max').val());
      var date = new Date(data[$('#dateCol').index()]);
      
      if (
        ( min === null && max === null ) ||
        ( min === null && date <= max ) ||
        ( min <= date && max === null ) ||
        ( min <= date && date <= max )
      ) {
        return true;
      }
      return false;
    }
  );
  table.draw();
});

But I need to display dates in the table in the format DD.MM.YYYY. If I display this format, then the filter is broken. As I understand it, instead of December (month 12), it displays all 12 numbers.

If I enter these dates:

The table is filtered like this:

But if I change the display of dates in the table to YYYY/MM/DD, then everything is filtered as needed.

Console.log input:

Console.log data:

If you change the date display format, then the "Invalid date" error disappears.

Changed format to YYYY/MM/DD console.log:

Help me solve this please