How to change the date from the default to yy-mm-dd? jQuery

Question

I've been trying to fix this for a while and can't figure out how to change the format for the date picker so it can match with my database. The date format I need is yy-mm-dd, but it looks the whole function is wrong

"columns": [ //just pseudo code for the fields
                      
{ "data": "pk" },
{ "data": "fields.first_name" },
{ "data": "fields.last_name" },
{ "data": "fields.email" },
{ "data": "fields.date_arrival" },
{ "data": "fields.date_departure" },

],

    //  Datepicker
    $.fn.dataTable.ext.search.push(function(settings, data, dataIndex) {
      var min = $('#min').datepicker("getDate");
      var max = $('#max').datepicker("getDate");
      var startDate = new Date(data[4]);
    
      if (min == null && max == null) {
        return true;
      }
      if (min == null && startDate <= max) {
        return true;
      }
      if (max == null && startDate >= min) {
        return true;
      }
      if (startDate <= max && startDate >= min) {
        return true;
      }
      return false;
    });
    
    $("#min").datepicker({
      dateFormat: "yy-mm-dd",
      onSelect: function() {
        table.draw();
      },
      changeMonth: true,
      changeYear: true
    });
    $("#max").datepicker({
      dateFormat: "yy-mm-dd",
      onSelect: function() {
        table.draw();
      },
      changeMonth: true,
      changeYear: true
    });
    //var table = $('#datatable').DataTable();
    
    // Event listener to the two range filtering inputs to redraw on input
    $('#min, #max').change(function() {
      table.draw();
    });

this is the playground I prepared: http://live.datatables.net/jadorolu/17/edit

click edit, then `[<>]` snippet editor and provide a [mcve] and tell us which datepicker you use — mplungjan, Feb 09 '21 at 07:14
BUt the dateformat looks correctly implemented - https://stackoverflow.com/questions/1328025/jquery-ui-datepicker-change-date-format - what is arriving at the server? — mplungjan, Feb 09 '21 at 07:17
Can you not post a [mcve] HERE and in your playground you do NOT have `dateFormat: "yy-mm-dd",` — mplungjan, Feb 09 '21 at 07:31

score 1 · Answer 1 · answered Feb 09 '21 at 07:24

The code looks right to me. I assume you are targeting the right elements #max and #min. I'd set the global configuration of the Datepicker first in the code, just in case.

If you have the possibility of using external libraries I'd consider including moment.js. You'll save many headaches when formatting, displaying and manipulating dates

score 0 · Accepted Answer · answered Feb 09 '21 at 07:17

You can use the dateFormat function and get your desired results.

$( function() {
    $( "#datepicker" ).datepicker({
        dateFormat: "yy-mm-dd"
    });
  } );

<link rel="stylesheet" href="https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>

<p>Date: <input type="text" id="datepicker"></p>

How to change the date from the default to yy-mm-dd? jQuery

2 Answers2