Aug
4
2012
CodeIgniter // PHP

Views & Templating in CodeIgniter

Author An article by Admin    Comments

What is a View?
Views are special files used in CodeIgniter to store the markup outputted by the application, usually consisting of HTML and simple PHP tags.

Views are loaded from within controller methods, with the content inside the view subsequently displayed in the browser.

Views are a key ingredient in any MVC application, and CodeIgniter applications aren’t any different. Today, we’re going to learn what a view is, and discover how they can be used to create a templating solution for your CodeIgniter projects.
Creating & Displaying a View
To setup our first view, create a new file called hello_world.php in application/views and write the following simple HTML within:

 

 

 

 

 

 

 

 

 

 

 <!DOCTYPE html>

<html>

   <head>

      <title>Codeigniter</title>

   </head>

   <body>

<form>
First name: <input type=”text” name=”firstname” /><br />
Last name: <input type=”text” name=”lastname” />

Password: <input type=”password” name=”pwd” />

<input type=”radio” name=”sex” value=”male” /> Male<br />
<input type=”radio” name=”sex” value=”female” /> Female

<input type=”checkbox” name=”vehicle” value=”Bike” /> I have a bike<br />
<input type=”checkbox” name=”vehicle” value=”Car” /> I have a car

<input type=”submit” value=”Submit” />
</form>

   </body>

</html>

 

Now to display this view in the browser it must be loaded within a Controller method, using the aforementioned method.

So let’s create a new Controller file called hello_world.php in application/controllers and place the following code within. From within this controller, we shall load the newly created view.

 

 

 

 

 

 

 

 

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

class Hello_world extends CI_Controller {

   

   public function index()

   {

      $this->load->view('hello_world');

   }

}

Pointing your browser to http://your-ci-install.com/index.php/ will now result in the HTML in application/views/hello_world.php being outputted in the browser. You have successfully loaded a view!
Templating in CodeIgniter
We’ve known that splitting views pages into separate, smaller files can help organize and reduce the number of files in your CodeIgniter projects, but now multiple load view calls need to be made each instance a page is displayed.

Let’s take an example. you have separate header and footer views, which are used to form a template. Every instance in the project where you wish to load and display a page using this template, three view loads have to be called. Not only can this clutter your controllers, but it results in a lot of repeated code – exactly the thing we wished to rid ourselves of by splitting the files up.

If you want to add extra markup to this template now, for example a sidebar menu. It could go in the header view, but it is more suited to be in its own separate view. Adding this new view to the existing template means going through each instance of the view loads, and adding another in. This can get messy fast.

We need a way to be able to embed view files that display individual page content, inside a template, without repeating code, and one that allows for modifications to be made to the template easily, and efficiently.

The following steps will guide you through creating a simple CodeIgniter library that fulfills these needs, as well as:

  • Allowing for multiple distinct templates to be used
  • Enforcing a predictable and maintainable directory structure for your views
  • Cutting down loading a page view to just one line of code

Once the library is written and in our CodeIgniter tool belt, we shall be able to display a templated page like so:

1 $this->template->load(‘template_name’, ‘body_view’);

Much nicer!

Our templating solution will use view files which contain the full markup of a template, with a placeholder for another view file (with the page content) to be embedded within.

The placeholder will actually just be a variable named $body. When loading a templated view with our library, the content of the appropriate body view file will be assigned to this $body, embedding the view within the the template.

About the Author:

3D Mick Admin (http://www.facebook.com/3dmick)

Leave a comment

You must be logged in to post a comment.