javascript - para - el evento de la fecha de cambio del selector de fecha del arranque no se inicia cuando se editan fechas manualmente o se borran

calendarios jquery

Question

<script type="text/javascript">
// When the document is ready
$(document).ready(function () {
$(''.datepicker'').datepicker({
format: "yyyy-mm-dd",
}).on(''changeDate'', function(ev){
// do what you want here
$(this).datepicker(''hide'');
}).on(''changeDate'', function(ev){
if ($(''#startdate'').val() != '''' && $(''#enddate'').val() != ''''){
$(''#period'').text(diffInDays() + '' d.'');
} else {
$(''#period'').text("-");
}
});
});
</script>

Así que esto es lo que parece mi datepicker. Básicamente, cuando cambio la fecha haciendo clic con el mouse, funciona bien. Sin embargo, cuando cambio manualmente la fecha con el teclado o borro manualmente el evento de fecha de cambio de fecha, no se realiza ninguna llamada. ¿Es esto un error o estoy haciendo algo mal aquí?

Answer 1

En la versión 2.1.5

• bootstrap-datetimepicker.js
• http://www.eyecon.ro/bootstrap-datepicker
• Aportaciones:
• Andrew Rowls
• Thiago de Arruda
• Actualizado para Bootstrap v3 por Jonathan Peterson @Eonasdan

changeDate ha sido renombrado a change.dp así que changeate no me funcionaba

$("#datetimepicker").datetimepicker().on(''change.dp'', function (e) {
FillDate(new Date());
});

También se necesita cambiar la clase css de datepicker a datepicker-input

<div id=''datetimepicker'' class=''datepicker-input input-group controls''>
<input id=''txtStartDate'' class=''form-control'' placeholder=''Select datepicker'' data-rule-required=''true'' data-format=''MM-DD-YYYY'' type=''text'' />
<span class=''input-group-addon''>
<span class=''icon-calendar'' data-time-icon=''icon-time'' data-date-icon=''icon-calendar''></span>
</span>
</div>

El formato de fecha también funciona en mayúsculas como este formato de datos = ''MM-DD-YYYY''

podría ser útil para alguien que me dio mucho tiempo :)

Answer 2

Esto debería hacer que funcione en ambos casos.

function onDateChange() {
// Do something here
}
$(''#dpd1'').bind(''changeDate'', onDateChange);
$(''#dpd1'').bind(''input'', onDateChange);

Answer 3

He encontrado una solución corta para ello. No se necesita ningún código adicional, solo active el evento changeDate . Por ejemplo, $(''.datepicker'').datepicker().trigger(''changeDate'');

Answer 4

La nueva versión ha cambiado. Para la última versión, use el siguiente código:

$(''#UpToDate'').datetimepicker({
format:''MMMM DD, YYYY'',
maxDate:moment(),
defaultDate:moment()
}).on(''dp.change'',function(e){
console.log(e);
});

Answer 5

Prueba esto:

$(".datepicker").on("dp.change", function(e) {
alert(''hey'');
});

Answer 6

changeDate utilizar el evento change en la entrada en sí si desea responder a la entrada manual, porque el evento changeDate es solo para cuando la fecha se cambia con el selector de fecha.

Intenta algo como esto:

$(document).ready(function() {
$(''.datepicker'').datepicker({
format: "yyyy-mm-dd",
})
//Listen for the change even on the input
.change(dateChanged)
.on(''changeDate'', dateChanged);
});
function dateChanged(ev) {
$(this).datepicker(''hide'');
if ($(''#startdate'').val() != '''' && $(''#enddate'').val() != '''') {
$(''#period'').text(diffInDays() + '' d.'');
} else {
$(''#period'').text("-");
}
}