Added compatibility with Bootstrap 4

Author: jprieton

README.md

@@ -1,4 +1,4 @@
-Bootstrap Alerts v1.0.1
+Bootstrap Alerts v1.2.0
 ===========
 
 A jQuery plugin for displaying Bootstrap alerts. [Demo](http://jprieton.github.io/bootstrap-alerts)
@@ -8,9 +8,9 @@ Usage
 
 ```javascript
 $('#alert-container').bootstrapAlert({
-    type: 'success', // Required, values: 'success', 'info', 'warning' or 'danger'
+    type: 'success', // Optional, , default: 'info',  values: 'success', 'info', 'warning' or 'danger'
     dismissible: true, // Optional, default: true 
-    title: 'My Title', // Optional, default: ''
+    heading: 'My Heading', // Optional, default: ''
     message: 'My message.',  // Required,
     clear: true // Optional, Clears the container, default: true 
 });

bootstrap-alerts.js

@@ -1,5 +1,5 @@
 /*
- * Bootstrap Alerts v1.0.2, jQuery plugin
+ * Bootstrap Alerts v1.2.0, jQuery plugin
  *
  * Copyright(c) 2015, Javier Prieto
  * http://jprieton.github.io/bootstrap-alerts/
@@ -8,49 +8,51 @@
  * Licensed under the MIT License
  */
 (function ($) {
-    $.fn.bootstrapAlert = function (options) {
-
-        var settings = $.extend({
-            type: null,
-            dismissible: true,
-            title: '',
-            message: '',
-            clear: true
-        }, options);
-
-        if (settings.type.lenght === 0) {
-            console.log('bootstrapAlert: type is empty');
-            return false;
-        }
-
-        if (settings.message.lenght === 0) {
-            console.log('bootstrapAlert: message is empty');
-            return false;
-        }
-
-        var div = $('<div class="alert alert-' + settings.type + '" role="alert">');
-
-        if (settings.dismissible) {
-            $(div).addClass('alert-dismissible');
-            var button = $('<button type="button" class="close" data-dismiss="alert" aria-label="Close">');
-            var span = $('<span aria-hidden="true">').html('&times;');
-            $(span).appendTo(button);
-            $(button).appendTo(div);
-        }
-
-        if (settings.title.length > 0) {
-            var title = $('<h4>').html(settings.title);
-            $(title).appendTo(div);
-        }
-
-        $(div).append(settings.message);
-
-        if (settings.clear) {
-            $(this).empty();
-        }
-
-        $(div).appendTo(this);
-
-        return this;
-    };
+  'use strict';
+
+  $.fn.bootstrapAlert = function (options) {
+
+    var settings = $.extend({
+      type: 'info',
+      dismissible: true,
+      heading: '',
+      message: '',
+      clear: true
+    }, options);
+
+    if (settings.type.lenght === 0) {
+      console.log('bootstrapAlert: type is empty');
+      return false;
+    }
+
+    if (settings.message.lenght === 0) {
+      console.log('bootstrapAlert: message is empty');
+      return false;
+    }
+
+    var div = $('<div class="alert alert-' + settings.type + '" role="alert">');
+
+    if (settings.dismissible) {
+      $(div).addClass('alert-dismissible');
+      var button = $('<button type="button" class="close" data-dismiss="alert" aria-label="Close">');
+      var span = $('<span aria-hidden="true">').html('&times;');
+      $(span).appendTo(button);
+      $(button).appendTo(div);
+    }
+
+    if (settings.heading.length > 0) {
+      var heading = $('<h4 class="alert-heading">').html(settings.heading);
+      $(heading).appendTo(div);
+    }
+
+    $(div).append(settings.message);
+
+    if (settings.clear) {
+      $(this).empty();
+    }
+
+    $(div).appendTo(this);
+
+    return this;
+  };
 })(jQuery);

bootstrap-alerts.min.js

@@ -1,6 +1,6 @@
 {
     "name": "bootstrap-alerts",
-    "version": "1.0.2",
+    "version": "1.2.0",
     "description": "A jQuery plugin for displaying Bootstrap alerts.",
     "main": "bootstrap-alerts.js",
     "keywords": [