This is to show you how to use Yii2 flash messages with Kartik Growl (bootstrap notify wrapper).

A default Yii2 flash message would be as follows:

Yii::$app->getSession()->setFlash('success', 'My success message!');

This doesn't work for what we are tying to do. We will need to add a few attributes/Info to our flash message.

Luckily Yii2's flash messages accepts an array for the $message property so we will take advantage of this.

You can dynamically set any of the plugins options like I do below but I will just set some of them.

'type'=>'success'//String, can only be set to danger, success, warning, info, and growl
'message'=>'Your Message' // String
'icon'=>'Your Icon class or a path to an image' //String
//duration is set dynamically because sometimes we have short messages and other times we have longer messages.
'duration'=>3000 //Integer //3000 default. time for growl to fade out.
'title'=>'Your Title' //String
'positionY'='top'//String // defaults to top, allows top or bottom
'positionX'='right'//String // defaults to right, allows right, center, left

So lets join the options with session like so

Plese Note:

• Message and titles are encoded by default because they are set from user input (dropdown list) in a lot of places.

• I also translate the messages and titles.

• All values check if they are set.

You can remove any of the things I just listed if you like as they are not necessary.

A configured flash message would look something like this

Yii::$app->getSession()->setFlash('success', [
    'type' => 'success',
    'duration' => 12000,
    'icon' => 'fa fa-users',
    'message' => Yii::t(Html::encode('My Message')),
    'title' => Yii::t('app', Html::encode('My Title')),
    'positonY' => 'top',
    'positonX' => 'left'
]);

You could also leave out a couple of settings and just use the default ones like

Yii::$app->getSession()->setFlash('success', [
    'type' => 'success',
    'icon' => 'fa fa-users',
    'message' => Yii::t(Html::encode('My Message')),
    'title' => Yii::t('app', Html::encode('My Title')),
]);

The above is placed in your action i.e. for example

public function actionCreate() {
$model = new SomeModel();

if ($model->load(Yii::$app->request->post()) && $model->save()) {
 Yii::$app->getSession()->setFlash('success', [
     'type' => 'success',
     'duration' => 5000,
     'icon' => 'fa fa-users',
     'message' => 'My Message',
     'title' => 'My Title',
     'positonY' => 'top',
     'positonX' => 'left'
 ]);
 return $this->redirect(['view', 'id' => $model->id]);
} else {
 return $this->render('create', [
             'model' => $model,
 ]);
}

In your view/layouts/main.php the actual growl widget should be placed in your body somewhere just like the default Yii2 Alert Widget.

use Yii;
use yii\helpers\Html;

//Get all flash messages and loop through them
<?php foreach (Yii::$app->session->getAllFlashes() as $message):; ?>
            <?php
            echo \kartik\widgets\Growl::widget([
                'type' => (!empty($message['type'])) ? $message['type'] : 'danger',
                'title' => (!empty($message['title'])) ? Html::encode($message['title']) : 'Title Not Set!',
                'icon' => (!empty($message['icon'])) ? $message['icon'] : 'fa fa-info',
                'body' => (!empty($message['message'])) ? Html::encode($message['message']) : 'Message Not Set!',
                'showSeparator' => true,
                'delay' => 1, //This delay is how long before the message shows
                'pluginOptions' => [
                    'delay' => (!empty($message['duration'])) ? $message['duration'] : 3000, //This delay is how long the message shows for
                    'placement' => [
                        'from' => (!empty($message['positonY'])) ? $message['positonY'] : 'top',
                        'align' => (!empty($message['positonX'])) ? $message['positonX'] : 'right',
                    ]
                ]
            ]);
            ?>
        <?php endforeach; ?>

If you get any class not found errors please ensure you are using the proper "use" statements in your files at the top!

That’s all you have to do, enjoy!