Hola mis compañeros Stackoverflowers, estoy trabajando con litepicker.js y me encontré con un inconveniente que espero que alguno de ustedes pueda ayudarme a resolver.
He construido dos litepickers separados y estoy poblando con éxito la fecha de hoy en el primero y la fecha de mañana en el segundo. (estos también se aceptan con éxito como minDate para ambos)
Lo que no he podido descifrar es cómo establecer la fecha mínima para el segundo selector de luz un día después de la fecha de inicio seleccionada del primer selector de luz.
Puedes ver dónde estoy en este codepen https://codepen.io/DigitalDesigner/pen/oNGRWzV
Código HTML:
<form> <input id="start-date" class="form-control start-date"> / <input id="end-date" class="form-control end-date"> </form>JavaScript:
<script> let current = new Date(); let tomorrow = new Date(current.getTime() + 86400000); // + 1 day in ms tomorrow.toLocaleDateString(); // Add litepicker calendar to stay dates const startpicker = new Litepicker({ element: document.getElementById('start-date'), singleMode: true, allowRepick: true, autoRefresh: true, format: 'D MMMM YYYY', startDate: current, minDate: new Date(), numberOfMonths: 1, numberOfColumns: 1, tooltipText: { one: 'night', other: 'nights' }, tooltipNumber: (totalDays) => { return totalDays - 1; }, plugins: ['mobilefriendly'] }); const endpicker = new Litepicker({ element: document.getElementById('end-date'), singleMode: true, allowRepick: true, autoRefresh: true, format: 'D MMMM YYYY', startDate: tomorrow, minDate: current, numberOfMonths: 1, numberOfColumns: 1, tooltipText: { one: 'night', other: 'nights' }, tooltipNumber: (totalDays) => { return totalDays - 1; }, }); </script>aquí está el sitio de litepicker: https://litepicker.com/
¿Cómo puedo establecer la minDate para el segundo litepicker en función de la primera fecha seleccionada por el litepicker?
Gracias por adelantado.
agrega esto al código
startpicker.on('selected', (date1, date2) => { endpicker.setOptions({ minDate: startpicker.getDate(), startDate: startpicker.getDate() }); });