Custom Flash message in Cakephp

Hello friends welcome to findnerd, in this blog we will discuss about flash messages in cakephp. Default flash messages will be customized. Cakephp has default warning messages for all actions. For example: Success flash message, Error flash message, Warning flash message, Information flash message etc. for various actions. Flash messages are displayed when controller action is redirected to another or the same page, these messages are built into session helper.

Lets begin with creating different elements depending on the type of message

Step 1: Create file success.ctp in app/View/Elements/ folder and write the following code in it.

<div class="success_msg alert"> <a href="#" class="close">x</a> <?php echo $message; ?> </div>

Step 2: Now create a file error.ctp in app/View/Elements/ folder and write the following code in it.

<div class="error_msg alert"><a href="#" class="close">x</a><?php echo $message; ?></div>

Step 3: Create file info.ctp in app/View/Elements/ folder and write the following code in it.

<div class="info_msg alert"><a class="close" href="#">x</a><?php echo $message; ?></div>

Step 4: Create file warning.ctp in app/View/Elements/ folder and the following code in it.

<div class="warning_msg alert"><a class="close" href="#">x</a><?php echo $message; ?></div>

Add CSS 

Now lets add css to the following file app/webroot/css/cake.generic.css for custom messages

.alert { border: 1px solid transparent; border-radius: 4px; margin-bottom: 20px; padding: 15px; } .error_msg { background-color: #f2dede; border-color: #ebccd1; color: #a94442; } .warning_msg { background-color: #fcf8e3; border-color: #faebcc; color: #8a6d3b; } .info_msg { background-color: #d9edf7; border-color: #bce8f1; color: #31708f; } .success_msg { background-color: #dff0d8; border-color: #d6e9c6; color: #3c763d; } .close{ text-decoration :none; float: right; }

Add Script files

Please make sure that you have included jquery in your default.ctp. Add the new common js just after the jquery inclusion.

<?php 
echo $this->Html->script('jquery.min');  
echo $this->Html->script('common'); 
?>

Create common,js file in app/webroot/js folder and add the following code.

$(document).ready(function(){ 
// fadeout flash messages on click 
$('#content .close').click(function(){ 
$(this).parent().fadeOut(); 
return false; }); 
// fade out flash messages after 3 seconds 
$('.alert').animate({opacity: 1.0}, 3000).fadeOut(); 
});

Finally you can use this flash message any where in your controller:

$this->Session->setFlash('You have successfully logged in'); //old way     
return $this->redirect(array('action' => 'index'));

Now pass success, info, error or warning as second parameter to it.

$this->Session->setFlash('You have successfully logged in','success'); // New way     
return $this->redirect(array('action' => 'index'));

All done!. Now you have created your own custom flash message in cakephp.

Thanks for reading.