Created
September 25, 2025 17:58
-
-
Save annuman97/9b50deba9f1f359c37ba9a5413c96626 to your computer and use it in GitHub Desktop.
Take booking seleccted date and time to the fluent form input field in order to put the value in custom html field.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| let pickedSlot = ''; //picked value from calendar | |
| document.addEventListener('click', function (e) { | |
| const spot = e.target.closest('.fcal_spot'); | |
| const next = e.target.closest('.ff-btn-next'); | |
| if (spot) { | |
| setTimeout(() => { | |
| const el = document.querySelector('.slot_time_range span'); | |
| if (el) { | |
| pickedSlot = el.textContent.replace(/\s+/g, ' ').trim(); | |
| } | |
| }, 0); | |
| } | |
| if (next) { | |
| next.blur(); // avoid the aria-hidden/focus warning | |
| setTimeout(() => { | |
| //Take the Input field Element Class here | |
| const input = document.querySelector('.mydate'); | |
| if (input && pickedSlot) { | |
| input.value = pickedSlot; | |
| input.dispatchEvent(new Event('input', { bubbles: true })); | |
| input.dispatchEvent(new Event('change', { bubbles: true })); | |
| } | |
| // (optional accessibility) focus the first field in the next step | |
| const nextStep = document.querySelector('.fluentform-step[aria-hidden="false"]'); | |
| if (nextStep) { | |
| const firstFocusable = nextStep.querySelector('input, select, textarea, button'); | |
| if (firstFocusable) firstFocusable.focus(); | |
| } | |
| }, 100); | |
| } | |
| }); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment