Dialog Box
Dialog Box with Different Roles

There are available 5 default Roles Dialog Box Service.

$.DialogBox().ShowDialogBox();
$.DialogBox().ShowConfirmDialogBox();
$.DialogBox().ShowAlertDialogBox();
$.DialogBox().ShowWarningDialogBox();
$.DialogBox().ShowSuccessDialogBox();

Loading Indicator
Show / Hide Loading Indicator

Just Required Bootstrap 4 and Jquery-3

$.DialogBox().ShowLoadingIndicator();
setTimeout( function () {
   $.DialogBox().HideLoadingIndicator();
}, 3000);

Custom Dialog Box
Dialog Box with partial custom config

Sample of Custom config with success dialog box

$.DialogBox().ShowSuccessDialogBox({
  Title: 'Success',
  Message: 'This show custom message and function callback.',
  CallBack: function (result ) {
     if( result == true ) {
      alert( result);
     }
  }
});
Dialog Box with fully custom config

There are provide some config to custom dialog box stype and callback

# Options Values
1 Type primary
secondary
success
warning
danger
info
light
dark
2 Size modal-lg
modal-sm
default is normal size
3 Title your custom title
4 Message your custom message
4 Buttons 
[{
    label: 'Click Me',
    cssClass: 'btn-light',
    action: function (obj ) {
      alert('inside button callback' );
      obj.modal.HideDialog();
    }
}]
 
$.DialogBox().ShowDialogBox({
  Type: 'dark',
  Title: 'Dark label Dialog box',
  Message: 'This show custom message and function callback.',
  Size: 'modal-lg',
  Buttons: [{
    label: 'Click Me',
    cssClass: 'btn-light',
    action: function (obj ) {
       // callback will pass dialogbox instance object, remember must call HideDialog to close Dialog before callback end
       alert('inside button callback' )
       obj.modal.HideDialog();     }
  }]
});