jquery-bsalert

jQuery Bootstrap Alerts v2.0.0

jQuery plugin to programmatically display bootstrap alerts

Installation

Download

• jquery.bsAlert.min.js (1.91kB, 911B gzipped)
• jquery.bsAlert.js (4.01kB, 1.3kB gzipped)

CDN

<script src="https://unpkg.com/jquery-bsalert@2.0.0/dist/jquery.bsAlert.min.js"></script>
<!-- OR -->
<script src="https://unpkg.com/jquery-bsalert@2.0.0/dist/jquery.bsAlert.js"></script>

Package Managers

Install via yarn:

$ yarn add jquery-bsalert

Install via NPM:

$ npm install jquery-bsalert --save

Usage

Standard Usage

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="https://unpkg.com/jquery-bsalert@2.0.0/dist/jquery.bsAlert.min.js"></script>
 
<script>
$(function() {
    if(someCheck) {
        $('#form').bsAlert('success', 'It was successful!');
    } else {
        $('#form').bsAlert('danger', 'Check form fields!');
    }
 
    // With all options
    $('#form').bsAlert({
        type: 'success',
        content: 'Thanks for contacting us!',
        dismissible: true,
        position: 'after'
    });
});
</script> 

Webpack and Browserify

$ yarn add jquery-bsalert

var $ = require('jquery');
require('jquery-bsalert');
 
$('#form').bsAlert('warning', 'This is a warning');

Options

Option	Type	Description	Default
type	string	Alert type. See http://getbootstrap.com/components/#alerts for the different types allowed.	danger
content	string or function	The alert's text or html content. Can also be a function, see below for an example..	''
dismissible	boolean	Whether the alert can be dismissed. Displays a close button if true	false
position	string or function	Where to position the alert. Valid options are 'before', 'after', or a function.	before

Using the position option as a function:

$('#form').bsAlert({
    // 'this' is bound to the plugin instance
    position: function($alert) {
        $alert.appendTo('.container');
    }
});

Using the content option as a function:

$('#form').bsAlert({
    // 'this' is bound to the plugin instance
    content: function() {
        if(this.options.dismissible) {
            return 'This is a dismissible alert';
        }
 
        return 'This is not a dismissible alert';
    }
});

Modify the $.fn.bsAlert object to change default option values:

$.fn.bsAlert.dismissible = true;

License

Released under the MIT license