0

Tengo un problema al intentar limpiar un datetimepicker de TempusDominus tengo una funcion la cual inizializa mi datatimepicker y le entrego un minDate y un maxDate dependiendo del valor de 2 input.

los 2 input obtienen su valor de un select el cual me trae una fecha inicial y una fecha de termino los cuales son los valores que le asigno al minDate y maxDate.

La funcion la activo al darle al btn "btnSiguiente" con un setTimeout(dateCalendar,100); pero necesito que al apretar el btn "btnAtras" se limpie el minDate y maxDate, ya que estos dependen de los input antes mencionados.

esta es mi funcion la cual contiene el 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,
  });
}

esta la activo al dar click en el "btnSiguiente"

$("#btnSiguiente").click(function(){
  $('#modal-alumno').modal('hide');
  setTimeout("$('#modal-horario-practico').modal('show')", 100);
  setTimeout(dateCalendar,100);
});

y esto es lo que intente al dar click en el "btnAtras"

(Tambien intente buscar algun metodo similar al destroy() de datepicker, pero no me funciono, me da error de que la función no existe)

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

pero no pasa nada al apretar el btnAtras.

Esta es la forma en que entrego los valores a los input mediante el 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);
});

intente inicializar el datetimepicker desde esta ultima funcion, para que se inicialice con el nuevo min/maxDate cada vez que cambiara este select2, pero no logre hacerlo

1 respuesta 1

0

SOLUCIONADO ya que no me funciono la forma de cambiar a null/false el min/maxDate, busque la forma de hacer un destroy al datetimepicker, y fue de la siguiente manera (en mi "btnAtras")

$calendar = $('#fecha_clase_0');
if($calendar.data('datetimepicker')){
  $calendar.data('datetimepicker').destroy();
}

Tu Respuesta

Al pulsar en “Publica tu respuesta”, muestras tu consentimiento a nuestros términos de servicio, política de privacidad y política de cookies

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.