/** the confirm action opens the 'front-dialog' by default, customize if needed! */ Turbo.config.forms.confirm_dialog_id = 'front-dialog' Turbo.config.forms.confirm_dialog_content_selector = '[data-dialog-content]' /** content might be either a String or a Boolean * * in case of True: the title with no content will appear */ Turbo.config.forms.confirm = (content) => { if (content.toString() == 'false') return new Promise((resolve) => { resolve(true) }) if (content.toString() == 'true') content = '' const dialog = document.getElementById(Turbo.config.forms.confirm_dialog_id) dialog.querySelector(Turbo.config.forms.confirm_dialog_content_selector).innerHTML = content dialog.showModal() return new Promise((resolve) => { dialog.addEventListener( 'close', () => { resolve(dialog.returnValue == 'confirm') }, { once: true }) }) } /** dialogId might be either a String or a Boolean * * in case of True: default dialog gets selected, (ie `Turbo.config.forms.confirm_dialog_id`) */ Turbo.config.forms.showModal = (dialogId) => { if (dialogId.toString() == 'false') return if (dialogId.toString() == 'true') dialogId = Turbo.config.forms.confirm_dialog_id const dialog = document.getElementById(dialogId) if (dialog) dialog.showModal() else console.warn(`dialog id=<${dialogId}> not found!`) } document.addEventListener('turbo:submit-start', (e) => { const dialogId = e.explicitOriginalTarget.dataset.turboShowModal if (dialogId) { e.detail.formSubmission.stop() Turbo.config.forms.showModal(dialogId) } })