Site Admin
Site Admin Founder of MeaningArticles
2286 Views

Codeigniter 3 Toastr Notifications Example

Hello Dev.

nowadays we are able to learn how to display flash alert messages in Codeigniter application.

As we understand, flash message(notification, alert) function may be very important due to the clients can apprehend their work is success or any mistakes like in case you create new user successfully then after create user successfully flash message will come on main page. identical as for others like all success, error, warning and so on. So in this example, i'm able to discover ways to display all type messages (alert), in Codeigniter project.

we are able to use toastr for display alert with good format. toastr provide us any kind of alert format of notification. toastr is open source and smooth to use. So let's begin the make example from scratch.


Step 1: Download Codeigniter Project

In First step we will download fresh version of Codeigniter 3, so if you haven't download yet then download from here: Codeigniter.


Step 2: Add Route

In this step, we will add one routes for demo. this tutorial so you can check each alert with demo. So let's add bellow routes in route file.
application/config/routes.php

<?php
defined('BASEPATH') OR exit('No direct script access allowed');

$route['default_controller'] = 'article';
$route['404_override'] = '';
$route['translate_uri_dashes'] = FALSE;

$route['success'] = 'firstcontroller/success';
$route['error'] = 'firstcontroller/error';
$route['warning'] = 'firstcontroller/warning';
$route['info'] = 'firstcontroller/info';


Step 3: Add Controller

In this step we require to create new firstcontroller controller, In that controller file we will write method for each flash example. So let's add with following code. you have to just copy of article.php controller file:
application/controllers/firstcontroller.php

<?php
defined('BASEPATH') OR exit('No direct script access allowed');

class firstcontroller extends CI_Controller {

   public function __construct() { 
      parent::__construct(); 
      $this->load->library("session");
   }

    public function success()
    {
      $this->session->set_flashdata('success', 'User Updated successfully');
      return $this->load->view('myPages');
    }

  public function error()
  {
      $this->session->set_flashdata('error', 'Something is wrong.');
      return $this->load->view('myPages');
  }

  public function warning()
  {
      $this->session->set_flashdata('warning', 'Something is wrong.');
      return $this->load->view('myPages');
  }

  public function info()
  {
      $this->session->set_flashdata('info', 'User listed bellow');
      return $this->load->view('myPages');
  }
}


Step 4: Add View Files

Now at last step we require to create "MainPage.php" and "alert.php" view files. alert.php file you can include all the files so each time you can easy generate notification messages in your project. So let's create both files:
application/views/MainPage.php

<!DOCTYPE html>
<html>

<head>
    <title>Toastr Demo</title>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/3.2.1/css/font-awesome.min.css" rel="stylesheet" />
</head>

<body>
<div>
    <?php
      $this->load->view('alert');
    ?>
</div>
</body>

</html>

application/views/alert.php

<script src="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/js/toastr.min.js"></script>
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/css/toastr.min.css">

<script type="text/javascript">

<?php if($this->session->flashdata('success')){ ?>
    toastr.success("<?php echo $this->session->flashdata('success'); ?>");
<?php }else if($this->session->flashdata('error')){  ?>
    toastr.error("<?php echo $this->session->flashdata('error'); ?>");
<?php }else if($this->session->flashdata('warning')){  ?>
    toastr.warning("<?php echo $this->session->flashdata('warning'); ?>");
<?php }else if($this->session->flashdata('info')){  ?>
    toastr.info("<?php echo $this->session->flashdata('info'); ?>");
<?php } ?>

</script>

i'm hoping it assist you to, thanks for visit my article if you like my article then proportion together with your friend and social platform.