Estoy tratando de obtener una fecha cuando hago clic en una fecha del calendario (cambiar). El documento dice que hay un disparador de eventos. Pero no puedo hacer que funcione. Hice un 'clic' personalizado de Event Listener, sin embargo, eso está activando todo el calendario.
Todos los objetos de evento de selector de fecha son instancias de evento personalizado y se envían al elemento asociado (para el selector en línea, el elemento de bloque).
const elem = document.querySelector('#kalenderdatum'); const datepicker = new Datepicker(elem, { calendarWeeks: true, todayHighlight: true }); elem.addEventListener('click', function(){ console.log('test'); console.log(datepicker.getDate()); });https://mymth.github.io/vanillajs-datepicker/#/api?id=datepicker
¿Puede alguien ayudarme a usar el desencadenador de eventos personalizados?
Aquí hay un ejemplo de trabajo para agregar un evento, para el selector de rango de fechas (asumiendo que estamos usando programación orientada a objetos (clases), el evento changeDate debe aplicarse a cada uno de los elementos de entrada. Tenga en cuenta que como estoy usando el selector de rango de fechas allí tengo dos entradas, pero en su caso puede estar usando una sola entrada para Datepicker.
this.dateRangePicker = new DateRangePicker( this.dateRangeEl, { clearBtn: true, } );
this.dateRangeInputEls = this.querySelectorAll( 'input' ); if ( this.dateRangeInputEls.length ) { this.dateRangeInputEls.forEach( ( dateInputEl ) => { dateInputEl.addEventListener( 'changeDate', ( event ) => this.handleDatesSelection( event ) ); } ); } handleDatesSelection( event ) { const dateEl = event.target; this.selectedDates = this.dateRangePicker.getDates( 'yyyy-mm-dd' ); const startDate = this.selectedDates?.[ 0 ] ?? ''; const endDate = this.selectedDates?.[ 1 ] ?? ''; console.log( 'this.selectedDates', this.selectedDates ); }