@saekitominaga/htmlformelement-before-unload-confirm

Show confirmation dialog message when page is tries to close while filling out a form.

If the page is tries to close with the contents of the form control changed, a confirm dialog is displayed to prevent the changes from being discarded.

Demo

• Demo page

Examples

<script type="module">
import FormBeforeUnloadConfirm from './dist/FormBeforeUnloadConfirm.js';

for (const formElement of document.querySelectorAll('.js-form-beforeunload-confirm')) {
  const formBeforeUnloadConfirm = new FormBeforeUnloadConfirm(formElement);
  formBeforeUnloadConfirm.init();
}
</script>

<form class="js-form-beforeunload-confirm">
  <p><input /></p>
  <p><button>Submit</button></p>
</form>

Constructor

new FormBeforeUnloadConfirm(
  thisElement: HTMLFormElement
)

Parameters

thisElement [required]

Target element