Link copied!

Confirmation Dialog

Usage

Name Description
window.e.utils.v2.ui.confirmationDialog.openConsequential(options) Opens consequential confirm dialog.
window.e.utils.v2.ui.confirmationDialog.openDestructive(options) Opens destructive confirm dialog.

Parameters

Name Description Type Required Default value
headline This is the title of the confirmation dialog. It will be sanitized by default. or HTMLElement yes
content This is the content of the confirmation dialog. It will be sanitized by default. or HTMLElement yes
disableSanitization Turn off automatic HTML sanitization on content of the confirmation dialog. Make sure the given content is sanitized! false
confirm.label This is the label of the confirmation button. no OK
confirm.callback This is the code to execute when the confirmation button is clicked. The dialog is closed automatically, no need to programatically close it. no
cancel.label This is the label of the cancel button. no Cancel
cancel.callback This is the code to execute when the cancel button is clicked. The dialog is closed automatically, no need to programatically close it. no

Examples

<div class="e-buttongroup">
  <a class="e-btn" href="#0" id="consequentialDialog">
    Open Consequential Dialog
  </a>
</div>
Copy Javascript
Copied to clipboard! 
document.getElementById('consequentialDialog').addEventListener('click', function() {
  window.e.utils.v2.ui.confirmationDialog.openConsequential({
    headline: 'Launch Campaign Now?',
    content: 'The email will be sent to an estimated 8 123 382 contacts.',
    footerClose: true,
    confirm: {
      label: 'Launch Campaign',
      callback() {
        console.log('Confirm clicked');
      }
    },
  });
});
<div class="e-buttongroup">
  <a class="e-btn" href="#0" id="destructiveDialog">
    Open Destructive Dialog
  </a>
</div>
Copy Javascript
Copied to clipboard! 
document.getElementById('destructiveDialog').addEventListener('click', function() {
  window.e.utils.v2.ui.confirmationDialog.openDestructive({
    headline: 'Delete This?',
    content: 'Once deleted, it cannot be accessed anymore.',
    footerClose: true,
    confirm: {
      label: 'Delete',
      callback() {
        console.log('Delete clicked');
      }
    },
  });
});