Cómo cambiar el formato de fecha (MM/DD/AA) a (AAAA-MM-DD) en el selector de fechas

Question

He foll0wing selector de fechas guión

<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> 

Ahora dateformat es MM/DD/AA .how al cambio el formato de fecha aAAA-mM-dD

Answer 1

Utilice la opción dateFormat

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

demo en http://jsfiddle.net/gaby/WArtA/

Answer 2

Pruebe lo siguiente:

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

se podría pensar que sería aaaa-mm-dd, pero bueno: P

Answer 3

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

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

Answer 4

Prueba esto:

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

Answer 5

Es necesario algo como esto durante la inicialización del selector de fechas:

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

Answer 6

Uso .formatDate(format, date, settings)

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

Answer 7

Gracias por todo. Obtuve mi salida esperada

<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> 

Answer 8

Tuve el mismo problema y he intentado con muchas respuestas, pero nada funcionó.

He intentado lo siguiente y funcionó con éxito:

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

Answer 9

this trabajó para mí.

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

Answer 10

esto también funcionó para mí. Vaya al bootstrap-datepicker.js.

sustituir este código:

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

con:

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

Answer 11

que utilizan este método para realizar la misma operación en mi aplicación

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); 

Answer 12

Este trabajo para mí:

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

Answer 13

si en dateformat jQuery no funciona entonces podemos manejar esta situación en la página HTML en el campo de entrada de su fecha de

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

y en javascript debajo de esta página, agregue su fecha código selector

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

Answer 14

sólo tiene que añadir dateFormat:'yy-mm-dd' a sus .datepicker({}) configuración, su .datepicker({}) puede ser algo como esto

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

    </script> 

Answer 15

Esto es lo que funcionó para mí en todas las versiones selector de fechas, en primer lugar, la conversión fecha en el formato de fecha interna de DatePicker, y luego convertirlo de nuevo al número deseado

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

Answer 16

Para mí en formato plugin de jQuery datetimepicker: 'D/M/A' opción se trabaja

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