Dialog

Usage

Name Description
window.e.utils.v2.ui.dialog({ content }) Opens a custom dialog with given content. It returns the reference of the dialog. methods.

Parameters

Name Description Type Required Default value
content Content can be a string (or HTML) or a DOM Node. domNode or html

Method Reference

Name Description
open Opens the custom dialog. Should be called on the reference of window.e.utils.v2.ui.dialog.
close Closes the custom dialog. Should be called on the reference of window.e.utils.v2.ui.dialog.

Examples

<div class="e-buttongroup">
  <a class="e-btn" href="#0" id="newDialog">
    Open Custom Dialog
  </a>
</div>
const dialogNode = document.createElement('div');
dialogNode.innerHTML = `
  <div class="e-dialog__header">Dialog Title</div>
  <div class="e-dialog__content">Dialog content goes here.</div>
  <div class="e-dialog__footer">
    <button class="e-btn e-btn-borderless">Close</button>
  </div>
`;

let dialog;

document.getElementById('newDialog').addEventListener('click', function() {
  dialog = window.e.utils.v2.ui.dialog({ content: dialogNode });
  dialog.open();
});

dialogNode.querySelector('.e-btn').addEventListener('click', function() {
  dialog.close();
});