[javascript] How to change date format (MM/DD/YY) to (YYYY-MM-DD) in date picker

I have following datepicker script:

<script>
 $(function(){
        $("#to").datepicker();
        $("#from").datepicker().bind("change",function(){
            var minValue = $(this).val();
            minValue = $.datepicker.parseDate("mm/dd/yy", minValue);
            minValue.setDate(minValue.getDate()+1);
            $("#to").datepicker( "option", "minDate", minValue );
        })
    });
</script> 

Now dateformat is MM/DD/YY .how to change the date format to YYYY-MM-DD?

Thanks for all. I got my expected output

<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/themes/base/jquery-ui.css" type="text/css" media="all">
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.11/jquery-ui.min.js"></script>

<script>
$(function(){
        $("#to").datepicker({ dateFormat: 'yy-mm-dd' });
        $("#from").datepicker({ dateFormat: 'yy-mm-dd' }).bind("change",function(){
            var minValue = $(this).val();
            minValue = $.datepicker.parseDate("yy-mm-dd", minValue);
            minValue.setDate(minValue.getDate()+1);
            $("#to").datepicker( "option", "minDate", minValue );
        })
    });

</script> 

<div class="">
    <p>From Date: <input type="text" id="from"></p>

    <p>To Date: <input type="text" id="to"></p>
</div>

just add dateFormat:'yy-mm-dd' to your .datepicker({}) settings, your .datepicker({}) can look something like this

            $( "#datepicker" ).datepicker({
                showButtonPanel: true,
                changeMonth: true,
                dateFormat: 'yy-mm-dd'
            });
          });

    </script> 

Use .formatDate( format, date, settings )

http://docs.jquery.com/UI/Datepicker/formatDate

This is what worked for me in every datePicker version, firstly converting date into internal datePicker date format, and then converting it back to desired one

var date = "2017-11-07";   
date = $.datepicker.formatDate("dd.mm.yy", $.datepicker.parseDate('yy-mm-dd', date));
// 07.11.2017

You need something like this during the initialization of your datepicker:

$("#your_elements_id").datepicker({ dateFormat: 'yyyy-mm-dd' });

If in jquery the dateformat option is not working then we can handle this situation in html page in input field of your date:

<input type="text" data-date-format='yyyy-mm-dd'  id="selectdateadmin" class="form-control" required>

And in javascript below this page add your date picker code:

 $('#selectdateadmin').focusin( function()_x000D_
     {_x000D_
       $("#selectdateadmin").datepicker();_x000D_
       _x000D_
     });

For me in datetimepicker jquery plugin format:'d/m/Y' option is worked

$("#dobDate").datetimepicker({
lang:'en',
timepicker:false,
autoclose: true,
format:'d/m/Y',
onChangeDateTime:function( ct ){
   $(".xdsoft_datetimepicker").hide();
}
});

Just need to define yy-mm-dd here. dateFormat

Default is mm-dd-yy

Change mm-dd-yy to yy-mm-dd. Look example below

  $(function() {
    $( "#datepicker" ).datepicker({
      dateFormat: 'yy-mm-dd',
      changeMonth: true,
      changeYear: true
    });
  } );

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

I had the same issue and I have tried many answers but nothing worked.

I tried the following and it worked successfully :

<input type=text  data-date-format='yy-mm-dd'  > 

Try this:

$.datepicker.parseDate("yy-mm-dd", minValue);

Try the following:

$('#to').datepicker({
      dateFormat: 'yy-mm-dd'
});

You'd think it would be yyyy-mm-dd but oh well :P

I used this approach to perform the same operation in my app.

var varDate = $("#dateStart").val(); 

var DateinISO = $.datepicker.parseDate('mm/dd/yy', varDate); 

var DateNewFormat = $.datepicker.formatDate( "yy-mm-dd", new Date( DateinISO ) );

$("#dateStartNewFormat").val(DateNewFormat);

$( ".selector" ).datepicker( "option", "dateFormat", 'yy-mm-dd' );

See: http://jqueryui.com/demos/datepicker/ and http://docs.jquery.com/UI/Datepicker/formatDate#utility-formatDate

this also worked for me. Go to the bootstrap-datepicker.js.

replace this code :

var defaults = $.fn.datepicker.defaults = {_x000D_
  autoclose: false,_x000D_
  beforeShowDay: $.noop,_x000D_
  calendarWeeks: false,_x000D_
  clearBtn: false,_x000D_
  daysOfWeekDisabled: [],_x000D_
  endDate: Infinity,_x000D_
  forceParse: true,_x000D_
  format: 'mm/dd/yyyy',_x000D_
  keyboardNavigation: true,_x000D_
  language: 'en',_x000D_
  minViewMode: 0,_x000D_
  multidate: false,_x000D_
  multidateSeparator: ',',_x000D_
  orientation: "auto",_x000D_
  rtl: false,_x000D_
  startDate: -Infinity,_x000D_
  startView: 0,_x000D_
  todayBtn: false,_x000D_
  todayHighlight: false,_x000D_
  weekStart: 0_x000D_
 };

with :

var defaults = $.fn.datepicker.defaults = {_x000D_
  autoclose: false,_x000D_
  beforeShowDay: $.noop,_x000D_
  calendarWeeks: false,_x000D_
  clearBtn: false,_x000D_
  daysOfWeekDisabled: [],_x000D_
  endDate: Infinity,_x000D_
  forceParse: true,_x000D_
  format: 'yyyy-mm-dd',_x000D_
  keyboardNavigation: true,_x000D_
  language: 'en',_x000D_
  minViewMode: 0,_x000D_
  multidate: false,_x000D_
  multidateSeparator: ',',_x000D_
  orientation: "auto",_x000D_
  rtl: false,_x000D_
  startDate: -Infinity,_x000D_
  startView: 0,_x000D_
  todayBtn: false,_x000D_
  todayHighlight: false,_x000D_
  weekStart: 0_x000D_
 };

this worked for me.

    $('#thedate').datepicker({
    dateFormat: 'dd-mm-yy',
    altField: '#thealtdate',
    altFormat: 'yy-mm-dd'
});

This work for me:

 $('#data_compra').daterangepicker({
          singleDatePicker: true,
          locale: {
           format: 'DD/MM/YYYY'
          },
         calender_style: "picker_4", }, 
function(start, end, label) {
          console.log(start.toISOString(), end.toISOString(), label); 
});