Returning Strings from Views with Code Igniter - Review: using nested views along with the load-vars() method (
Page 2 of 4 )
It’s possible that you still haven’t had the chance to read the preceding article. As I mentioned, I went through the development of a simple MySQL-driven PHP application that utilized a mixture of nested views and the “$this->load->vars()” method to generate a dynamic web page. Below I included all of the source files that comprised this PHP program, so you can examine them in detail. Here they are:
(definition of ‘webpage.php’ file – located at /application/controllers/ folder)
<?php
class WebPage extends Controller{
function WebPage(){
// load parent controller
parent::Controller();
// load libraries here
$this->load->database();
// load helpers here
}
// generate web page with nested views and the ‘load->vars()’ method
function index(){
// generate header, content and footer sections
$data=array('header'=>'Header Section','users'=>$this->db->get('users'),'footer'=>'Footer Section');
// load variables in views
$this->load->vars($data);
// load 'main_page' view
$this->load->view('main_page');
}
}
?>
(definition of ‘main_page.php’ file - located at /application/views/ folder)
<?php
$this->load->view('header_view');
$this->load->view('content_view');
$this->load->view('footer_view');
?>
(definition of ‘header_view.php’ file - located at /application/views/ folder)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Sample Web Page</title>
<link rel="stylesheet" type="text/css" href="../assets/css/default.css" media="screen" />
</head>
<body>
<div id="container">
<div id="header">
<h1><?php echo $header;?></h1>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi.</p>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi.</p>
</div>
(definition of ‘default.css’ file - located at /codeigniter/assets/css/ folder)
body{
padding: 0;
margin: 0;
background: #999;
}
#container{
width: 600px;
margin: 0 auto;
}
#header{
padding: 10px;
background: #eee;
}
#content{
padding: 10px;
background: #9cf;
}
#footer{
padding: 10px;
background: #eee;
}
h1{
font: bold 2em Arial, Helvetica, sans-serif;
margin: 0 0 18px 0;
color: #039;
}
h2{
font: bold 1.5em Arial, Helvetica, sans-serif;
margin: 0 0 18px 0;
}
p{
font: normal .8em Arial, Helvetica, sans-serif;
margin: 0 0 18px 0;
}
(definition of ‘content_view.php’ file - located at /application/views/ folder)
<div id="content">
<?php if($users->num_rows > 0):?>
<?php foreach($users->result() as $user):?>
<p><strong>First Name: </strong><?php echo $user->firstname;?></p>
<p><strong>Last Name: </strong><?php echo $user->lastname;?></p>
<p><strong>Email: </strong><?php echo $user->email;?></p>
<hr />
<?php endforeach;?>
<?php endif;?>
</div>
(definition of ‘footer_view.php’ file - located at /application/views/ folder)
<div id="footer">
<h2><?php echo $footer;?></h2>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi.</p>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi.</p>
</div>
</div>
</body>
</html>
Regardless of the apparently complex structure of the above CI-based application, each one of its parts performs some simple tasks. First, the controller is responsible for generating the typical sections of a web page, that is the header, contents area and footer. In this particular case, the main section of the web document is filled in with some database rows previously fetched from a MySQL table. But undoubtedly, the most relevant thing to spot here is how nested views are used to build the aforementioned web page sections.
Having reviewed quickly this approach to handling view files with CodeIgniter, the next thing that I’m going to discuss will be how to construct a web page similar to the above, but this time using an additional parameter with the “$this->load->view()” method. In case you’re not aware of it, when this method is called with a third argument, for instance like this:
$data[‘header’]=$this->load->view(‘myview’,array(‘title’=>’Header Section’),TRUE);
Then, not only the $title variable will be parsed within the view, but the resulting string will be returned to calling code, and in this case will be stored on the $data array as well. As you can see, this can be really useful for storing partial sections of a web page on variables, before rendering them completely on screen.
So, in the next section I’ll be explaining in more detail how to load views as shown before. However, to learn how this will be done, you’ll have to click on the link below and keep reading.
