Edit in JSFiddle

function popupOnAPopup() {
  BootstrapDialog.show({
    title: 'Yo DAWG!  A popup on your popup',
    message: function(dialog) {
      return $('<div>I heard you like that</div>');
    },
    draggable: true,
    buttons: [
      {
        label: 'Close',
        cssClass: 'btn btn-default btn-sm',
        action: function(dialogItself){
          dialogItself.close();
        }
      },
    ],
    onshow: function(dialog){
      dialog.$modal.css('visibility', 'hidden');
    },
    onshown: function(dialog){
      setTimeout(function() {
        var tier = $('.bootstrap-dialog').length - 1;
        dialog.$modal.prev(".modal-backdrop")
            .css("z-index", 1030 + tier * 30);
        dialog.$modal
            .css("z-index", 50000 + tier * 30);
        dialog.$modal.css('visibility', 'visible');
      }, 100);
    },
  });
}
 
$(function() {
  BootstrapDialog.show({
    title: 'Popups are great',
    message: function(dialog) {
      return $('<div>Popups are great.  Lets use them for everything.  <a href="#" onClick="popupOnAPopup();">Add a popup on your popup</a></div>');
    },
    buttons: [
      {
        label: 'Close',
        cssClass: 'btn btn-default btn-sm',
        action: function(dialogItself){
          dialogItself.close();
        }
      },
    ],  
  });
});