Easy Development With CodeIgniter
videos

Easy Development With CodeIgniter

on Jun 25th 2009 with 154 comments

In this week’s 30 minute screencast, I’m going to show you how easy it is to work with the MVC pattern and CodeIgniter. This video is aimed at beginners who have no experience with a PHP framework.

For demonstration purposes, we’ll be building a simple image upload utility. We’ll then perform some validation, save the file to our uploads folder, and automatically create a respective thumbnail. With raw PHP, this can be somewhat time-consuming. However, with CodeIgniter, it’s simply a matter of referencing the correct library, and passing in some configuration options! Let’s dive in.

The Tutorial

Final Controller

<?php

class Upload extends Controller {
	
	function Upload() {
		parent::Controller();
		// $this->load->helper('form');
	}
	
	function index() {
		$this->load->view('upload_form');
	}
	
	function doUpload() {
		$config['upload_path'] = 'uploads/';
		$config['allowed_types'] = 'gif|jpg|jpeg|png';
		$config['max_size'] = '1000';
		$config['max_width'] = '1920';
		$config['max_height'] = '1280';						
		
		$this->load->library('upload', $config);
		
		if(!$this->upload->do_upload()) echo $this->upload->display_errors();
		else {
			$fInfo = $this->upload->data();
			$this->_createThumbnail($fInfo['file_name']);
			
			$data['uploadInfo'] = $fInfo;
			$data['thumbnail_name'] = $fInfo['raw_name'] . '_thumb' . $fInfo['file_ext'];
			$this->load->view('upload_success', $data);	
		}
	}
	
	function _createThumbnail($fileName) {
		$config['image_library'] = 'gd2';
		$config['source_image'] = 'uploads/' . $fileName;	
		$config['create_thumb'] = TRUE;
		$config['maintain_ratio'] = TRUE;
		$config['width'] = 75;
		$config['height'] = 75;
		
		$this->load->library('image_lib', $config);
		if(!$this->image_lib->resize()) echo $this->image_lib->display_errors();
	}
}

Final View

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
 
<html>
  <head>
    <title>Upload an Image </title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  </head>
  
  <body>
    <div id="container">
    	<h2>Upload an Image </h2>

		<?php echo form_open_multipart('upload/doUpload'); ?>
		<input type="file" name="userfile" />
		<p><input type="submit" value="Submit" name="submit" /></p>
		<?php echo form_close(); ?>
    </div>

  </body>
</html>

I hope you guys enjoyed this video tutorial. If you’d like to see more CodeIgniter tutorials and videos on Nettuts+, please be loud in the comments. I know I’d like to see more! I’m in the process of learning this framework myself, so links to resources, tips, etc. will be much appreciated!


 
Enjoyed this Post?

Subscribe to our RSS Feed, Follow us on Twitter or simply recommend us to friends and colleagues!

By

Rollover to read this author's bio or click through to see a full list of posts by this author.

I'm the editor of Nettuts+, and love making the process of building for the web as easy as possible. Also, I'm finishing up my latest book on Laravel Testing! If you want be friends, say hi on Twitter.  

Plus Premium
 
 
Note: Want to add some source code? Type <pre><code> before it and </code></pre> after it. Find out more
← Older Comments
  • Israel

    Hi Jeff great job, I know this is just an intro to Codeigniter but since you’re using the controller and view, why not use the model as well, since one of the main ideas behind the framework is the use of the MVC pattern.

    I would love to see how you implement the use of the model in order to get the application running.

    Thanks.

  • https://www.facebook.com/kennyalmendral Kenny Almendral

    Nice !

  • christian louboutin

    When the third seat is folded flush, there’s 32 cubic feet of cargo space. The cosmopolitan nature of the city, the year round moderate climate, and a history of peace loving people has always made Bengaluru a favorite place to live for many a luminary. This will no doubt bring a warm effect on the otherwise cold weather and fashion scenario.

  • tenfold

    Does anyone know why the following does not work in PHP5 w/ CodeIgniter 2.1.1 even when the Controller class is updated to CI_Controller. Thanks.

    class Upload extends Controller {

    function Upload() {
    parent::Controller();
    // $this->load->helper(‘form’);
    }

    function index() {
    $this->load->view(‘upload_form’);
    }

    • http://way2getstuff.com Prasad

      Hi,

      Check the below code it will help you.

      class Upload extends CI_Controller {

      function __construct()
      {
      parent::__construct();
      }

      function index()
      {
      $this->load->view(‘upload_form’);
      }

    • Rusty Sams

      @tenfold

      This believe this tut was made using CodeIgniter 1.7.2. In CodeIgniter 2.1.1 there have been a few changes regarding Controllers. If you visit the Controllers section of your user guide you’ll see the changes.(for future problems you may encounter).
      But try this code instead and see if it works. Hope it does!

      class Upload extends CI_Controller {

      function __construct() {
      parent::__construct();
      // $his->load->helper(‘form’);
      }

      function index() {
      $this->load->view(‘upload_form’);
      }
      }

  • daniel

    hi jeff,

    suppose i need to save the filenames / files for each user in db after uploading them. how am going to accomplish that?

  • Suresh

    Hi Jeff,
    Good Tutorial enjoyed the way u teach.

  • http://emilenriquez.wordpress.com emil

    HI great tutorial.. I just have a few problems

    I have a function for uploading and creating the thumbnail but it seems like only the upload function is successful. Please tell me which part did i make a mistake thanks

    // upload function
    function doUpload() {
    $config['upload_path'] = ‘user_uploads/’;
    $config['allowed_types'] = ‘gif|jpg|jpeg|png|bmp’;
    $config['max_size'] = ’800′;
    $config['max_width'] = ’1920′;
    $config['max_height'] = ’1280′;

    $this->load->library(‘upload’, $config);

    if(!$this->upload->do_upload()) echo $this->upload->display_errors();
    else {
    $fInfo = $this->upload->data();
    if(!$this->_createThumbnail($fInfo['file_name']))$this->image_lib->display_errors();

    $data['uploadInfo'] = $fInfo;
    $data['thumbnail_name'] = $fInfo['raw_name'] . ‘_thumb’ . $fInfo['file_ext'];
    //$this->load->view(‘upload_success’, $data);
    }
    }

    //create thumbnail
    function _createThumbnail($fileName) {
    $config['image_library'] = ‘gd2′;
    $config['source_image'] = ‘user_uploads/’ . $fileName;
    $config['create_thumb'] = TRUE;
    $config['maintain_ratio'] = FALSE;
    $config['width'] = 75;// can be altered depending on designer’s preference i deit lng niya ni jey
    $config['height'] = 75;
    //echo $config['image'];
    $this->load->library(‘image_lib’, $config);
    if(!$this->image_lib->resize()) echo $this->image_lib->display_errors();
    else
    $this->image_lib->clear();
    }

  • http://www.facebook.com/decebal4art Decebal Dobrica

    I think this tutorial is a bit deprecated, first of all it is difficult to upload multiple files because you have to use the same name for all of them, you cannot use an array of files

← Older Comments