Alert

There’s times where you need to alert something to your visitor, maybe you want to warn them before they delete a record. You could use the build in browser’s alert method, but that doesn’t follow your branding does it?

This alert plugin creates a nice wrapper around the modal plugin already present, with the ability for multiple ‘types’ and cancel/confirm events, the alert plugin is a great addition to any website.

If you do not need a cancel button, remove the option to set the cancel text!

Creating an alert dialog

Creating an alert dialog is as easy as creating any other plugin instance within BulmaJS.

Bulma.create('alert', {
    type: 'danger',
    title: 'This is an alert!',
    body: 'Ooohh what button you gonna click?',
    confirm: 'Confirm it!',
    cancel: 'Maybe not'
});

Multiple alert types

Whether you’re just informing your user of something, showing them a success message or alerting them to a problem, the alert plugin has you covered. Simply set the type option to danger, warning, success or info to change the look of the alert modal.

Confirm / Cancel events

What’s the point in a popup if you can’t use it for input? The alert plugin can take an onConfirm and/or onCancel option. This will be a function that’s called when the user clicks the confirm button or the cancel button. Try it!

Bulma.create('alert', {
    type: 'danger',
    title: 'This is an alert!',
    body: 'Ooohh what button you gonna click?',
    confirm: 'Confirm!',
    cancel: 'Cancel!',
    onConfirm: function() {
        Bulma.create('alert', {
            title: 'Confirmed',
            body: 'You clicked confirm!'
        });
    },
    onCancel: function() {
        Bulma.create('alert', {
            title: 'Cancelled',
            body: 'You clicked cancel!'
        });
    }
});