I have a problem when trying to clean a datetimepicker from TempusDominus I have a function which initializes my datatimepicker and gives it a minDate and a maxDate depending on the value of 2 input.
The 2 inputs get their value from a select which brings me a start date and an end date which are the values that I assign to minDate and maxDate.
I activate the function by pressing the "btnNext" button with a setTimeout(dateCalendar,100);
but I need that when pressing the "btnBack" button the minDate and maxDate are cleared, since these depend on the aforementioned inputs.
this is my function which contains the datetimepicker
var dateCalendar = function(){
var dateFormat = "DD/MM/YYYY";
var MinDate = $('#fecha_inicio_curso').val();
var MaxDate = $('#fecha_termino_curso').val();
dateMin = moment(MinDate, dateFormat);
dateMax = moment(MaxDate, dateFormat);
$(".date").datetimepicker({
locale: 'es',
format: dateFormat,
minDate: dateMin,
maxDate: dateMax,
});
}
it is active by clicking on the "btnNext"
$("#btnSiguiente").click(function(){
$('#modal-alumno').modal('hide');
setTimeout("$('#modal-horario-practico').modal('show')", 100);
setTimeout(dateCalendar,100);
});
and this is what I try to click on the "btnBack"
(I also tried to find a method similar to datepicker's destroy() , but it didn't work for me, it gives me an error that the function doesn't exist)
$("#btnAtras").click(function(){
$('#modal-horario-practico').modal('hide');
setTimeout("$('#modal-alumno').modal('show')", 100);
$('#fecha_clase_0').datetimepicker({
minDate: null, // tambien intente con 'false'
maxDate: null
});
$('#fecha_clase').datetimepicker("clear"); // da error
})
but nothing happens when you press the btnBack.
This is how I deliver the values to the input using the select2
$('#cursos').on("select2:selecting", function(e) {
$('#fecha_inicio_curso').val('');
$('#fecha_termino_curso').val('');
var fechasCurso = function(){
var curso_id = $("#cursos").val();
var view_html='';
var url = "{{ url('getFechasCurso') }}/"+curso_id;
$.get(url, function (r) {
var data = $.parseJSON(r);
console.log(data);
if(data.id_curso>0){
var fecha_i = data.fecha_inicio;
var fecha_t = data.fecha_termino;
var fecha_inicio = fecha_i.replace(/\//g, '-');
var fecha_termino = fecha_t.replace(/\//g, '-');
$('#fecha_inicio_curso').val(fecha_inicio);
$('#fecha_termino_curso').val(fecha_termino);
}
});
}
setTimeout(fechasCurso,100);
});
try to initialize the datetimepicker from this last function, so that it will be initialized with the new min/maxDate every time this select2 will change, but failed to do so
SOLVED since the way to change the min/maxDate to null/false did not work for me, I looked for a way to destroy the datetimepicker, and it was as follows (in my "btnAtras")