README

A simple Alerts class integrated with htmx and Alpine.js for CodeIgniter 4 framework.

Installation

composer require michalsn/codeigniter-htmx-alerts:dev-develop

Configuration

You have to publish the config file first:

php spark alerts:publish

Now you can change:

$key

Alerts key name used in views and session.

$displayTime

The default alert display time in milliseconds.

$types

The array of message types, where array key is a CSS class and value is the title of the alert type.

Array keys are also used to determine the type of the alert we want to set, ie:

alerts()->set('success', 'Success message goes here.');

$htmlWrapperId

Wrapper id name, used in the view file.

$views

View files used by this library. You can change them to reflect the current style/theme you're using.

The default view files are designed to play along with Tabler theme.

Usage

In your main layout place the code (usually it will be just before the closing </body> tag):

<?= alerts()->container(); ?>

Don't forget to include these scripts in your main layout for proper functionality:

<script src="https://unpkg.com/htmx.org@2.0.4"></script>
<script src="//unpkg.com/alpinejs" defer></script>

That's it. You're ready to go. No matter if this is a htmx request or traditional one, your alerts will be placed correctly every time.

Adding alerts

You can add alerts in your controllers.

// success alert
alerts()->set('success', 'Success message');
// error message
alerts()->set('danger', 'Error message');
// custom display time - 1 sec (in milliseconds)
alerts()->set('success', 'Message', 1000);

Custom Alert Title

With the new method withTitle(), you can set a custom title for your alerts.

// success alert with a custom title
alerts()->withTitle('Custom Title')->set('success', 'Success message');
// error alert with a custom title
alerts()->withTitle('Oops!')->set('danger', 'Error message');

You can also configure whether the Custom Alert Title should be reset after each set() call by passing a second parameter:

// success alert with a custom title that will not reset after each set
alerts()->withTitle('Custom Title', false)->set('success', 'Success Message One');
alerts()->set('success', 'Success Message Two');

Removing alerts

You can also remove alerts by type.

// will remove all success alerts
alerts()->clear('success');
// will remove all alerts
alerts()->clear();

michalsn / codeigniter-htmx-alerts

Maintainers

Details