Tiny confirmation modal dialog in Vanilla JavaScript

Ciprian on Tuesday, March 8, 2022 in JavaScript DOM

NEW! Learn JavaScript by example. Code snippets, how-to's and tutorials. Try now!

Thin UI Modal Dialog using Vanilla JavaScript
Thin UI Modal Dialog using Vanilla JavaScript

A new addition to my Thin UI library, a much needed modal dialog, this script is tiny and it works with anything you can throw at it. It’s written in Vanilla JavaScript with no dependencies.

One of my ongoing project needed several confirmations on several different pages. As these actions might be delayed, I needed something to work asynchronously. This script adds a custom confirm dialog with Promise support to your website application.

The modal returns a Promise with the selected option: true if the user accepted, false if the user clicked cancel and null if the user closed the modal window.

The modal constructor takes four parameters: the title, the content and the button labels (“Accept” or “Cancel”).

See the example on the Thin UI page or a live Codepen below:

See the Pen RJS (alpha) by Ciprian (@ciprian) on CodePen.

Related posts

Leave a Reply

You have to agree to the comment policy.

Follow me!

If you like this article, go ahead and follow me on Twitter or buy me a coffee to support my work!

Follow @getButterfly