Overview

Send push notifications to visitors using toast.

Reference

Class Methods
Name Description
public static success() Show success toast message.
Parameters:
  • message: string
    Toast Message.
  • title?: string|undefined
    Toast Title. Default is no title (undefined).
  • delay?: number
    Delay in milliseconds before hiding the toast. Default is 5000.
public static info() Show info toast message.
Parameters:
  • message: string
    Toast Message.
  • title?: string|undefined
    Toast Title. Default is no title (undefined).
  • delay?: number
    Delay in milliseconds before hiding the toast. Default is 5000.
public static warning() Show warning toast message.
Parameters:
  • message: string
    Toast Message.
  • title?: string|undefined
    Toast Title. Default is no title (undefined).
  • delay?: number
    Delay in milliseconds before hiding the toast. Default is 5000.
public static error() Show error toast message.
Parameters:
  • message: string
    Toast Message.
  • title?: string|undefined
    Toast Title. Default is no title (undefined).
  • delay?: number
    Delay in milliseconds before hiding the toast. Default is 5000.

All States

Here is an example of each dialog.
              <button data-on-success type="button" class="btn btn-success m-1">Toggle Success</button>
<button data-on-error type="button" class="btn btn-danger m-1">Toggle Error</button>
<button data-on-warning type="button" class="btn btn-warning m-1">Toggle Warning</button>
<button data-on-info type="button" class="btn btn-info m-1">Toggle Info</button>
            
              import {components} from 'metronic-extension';

// Toggle Success.
$('[data-on-success]').on('click', () => {
  components.Toast.success('This is a toast message', 'Toast Title');
});

// Toggle Error.
$('[data-on-error]').on('click', () => {
  components.Toast.error('This is a toast message', 'Toast Title');
});

// Toggle Warning.
$('[data-on-warning]').on('click', () => {
  components.Toast.warning('This is a toast message', 'Toast Title');
});

// Toggle Info.
$('[data-on-info]').on('click', () => {
  components.Toast.info('This is a toast message', 'Toast Title');
});