Tengo un caso allí. Quiero seleccionar Mes y Día de la interfaz de usuario para crear una tarea recurrente. No es necesario seleccionar un año. Deben mostrarse 28 días en febrero. Estoy usando Bootsrap para crear la interfaz de usuario. Inicialmente pensé en considerar debajo de la opción para implementar el mismo
Cree un menú desplegable donde se mostrarán todos los meses (es decir, enero, febrero, marzo, diciembre)
Cree otro menú desplegable para cargar Días (1,2...31). Este menú desplegable debe volver a cargarse según la selección del Mes.
¿Es posible hacer lo mismo usando el selector Tempus-Dominus Datetime? https://getdatepicker.com/5-4/
He creado un violín de muestra. Donde quiero mostrar algo similar (Mar - 31) después de seleccionar. El año no debe estar allí en DateTimepicker. (Por defecto, considere el año como 2022. Pero no debe mostrarse en ninguna parte de Datetimepicker).
$('#datetimepicker1').datetimepicker({ format: 'MM-DD' });https://jsfiddle.net/8ck1tanb/1/
¿Alguien puede sugerir un mejor diseño/enfoque fácil de usar para implementar esta funcionalidad? Será más útil si puede compartir código de muestra si ya está implementado.
Puede utilizar los eventos tempus-dominus-datetimepicker para dividir el mes y el año y mostrar solo el mes.
Aquí hay un violín de ejemplo.
$('#datetimepicker1').on('show.datetimepicker update.datetimepicker change.datetimepicker',function(){ if(typeof $(this).find('.picker-switch').html() !== "undefined"){ $(this).find('.picker-switch').html($(this).find('.picker-switch').html().split(" ")[0]); }; });show.datetimepicker se activa cuando se abre la ventana emergente.update.datetimepicker se activa cuando usa las flechas 'siguiente' 'anterior'change.datetimepicker se activa cuando selecciona una fechaACTUALIZAR
Este violín tiene el 29 de febrero deshabilitado para los próximos 3 años bisiestos. Simplemente puede deshabilitar fechas específicas con la opción disabledDates .
$('#datetimepicker1').datetimepicker({ disabledDates: [new Date('2024-02-29'),new Date('2028-02-29'),new Date('2032-02-29')] });