Easy to use Javascript dialog box!
Easily create a messagebox, alert, confirm, prompt, toast, or whatever you want to put in a dialog box.
- Plain vanilla Javascript, no libraries needed.
- Customizable
- Draggable
- Resizable
- Responsive
- Using standard Javascript (ES5), HTML and CSS. Crossbrowser, trying to support legacy browsers as much as possible.
- Lightweight
Documentation and live examples: https://keejelo.github.io/EasyDialogBox/documentation.html
Below shows a very basic and simple example of how to create and show a dialogbox:
let myBox = EasyDialogBox.create('myId', 'dlg', 'My title', '<p>Hello there!</p>'); myBox.show();
Produces this:
This is the default style, but it can of course be customized as you wish with optional flags, colors, and even further with editing the css-file.The content can be anything you want, Html, plain text.
Adding your own custom buttons to the footer is also possible.
See more examples: https://keejelo.github.io/EasyDialogBox/documentation.html#js_example
-
Version 1.735 and above:
Removed parameterbKeepAlive
from function:EasyDialogBox.create(...);
Syntax is now:
EasyDialogBox.create(id, strBoxTypeClass, strTitle, strMessage, fnCallback, x, y, w, h);
-
Version 1.722 and above:
The "classflags" below has had their names changed due to naming ambiguity causing bugs:- "dlg-no-drag" is now called "dlg-disable-drag"
- "dlg-no-btns" is now called "dlg-disable-btns"
- "dlg-no-overlay" is now called "dlg-disable-overlay"
- "dlg-no-footer" is now called "dlg-disable-footer"
I started this when I needed a multipurpose dialogbox for my own projects. Not wanting to be dependant on any libraries, I wrote this dialogbox module using only plain Javascript. If anyone else finds this useful that's great.
Although dialogboxes has got a "bad rap" in the web-world, I still think they have their use when used correctly and in the right settings.
Thanks to ray73864 for testing and feedback.
MIT © keejelo