CodeIgniter Tutorial – To do list application#2

March 17th, 2009

ci_logo_flame

Let’s continue our journey with CodeIgniter, last time we built a simple to do list application. It is so simple and only have 1 feature, list your to do list.

But wait, right now we’ll add more power to this application. We will go step by step in this tutorial.

The to do list application are meaningless if we could not add new one. So let’s go upgrade it.

So, ready to open your favourite editor? Here we go.

Model

Open your todo model, /system/application/models/todo_model.php and update your todo_model by adding one function, function add. See the following code.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27

<?php
class Todo_model extends Model {
 
    public function __construct()
    {
        // model constructor
        parent::__construct();
	}
 
    function getCompletedTodo()
    {
        $query = $this->db->get_where('todo', array('status' => '0'));		
        return $query->result();
    }
 
    function getNextTodo()
    {
        $query = $this->db->get_where('todo', array('status' => '1'));	
        return $query->result();
    }
 
    function add($data)
    {
        $this->db->insert('todo', $data); 
    }
}
?>

Controller

Open your todo controller, /system/application/controllers/todo.php. As you see, we’re adding URL helper and session library. We need URL helper to call function such as anchor and site_url. It will be used in our view. And session library is included for handling flash message.

Now update your todo controller to this following code.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48

<?php
class Todo extends Controller {
 
    public function __construct()
    {
        parent::__construct();
        $this->load->model('Todo_model');
        // load url helper
        $this->load->helper('url');
        // load session library
        $this->load->library('session');
    }
 
    function index()
    {        
        $data['flash_message'] = $this->session->flashdata('message');
        $data['todo_list'] = $this->Todo_model->getNextTodo();
        $data['completed_list'] = $this->Todo_model->getCompletedTodo();
        $this->load->view('todo/index', $data);
    }
 
    function add()
    {   
        $this->load->library('form_validation');
 
        // validation rules
        $this->form_validation->set_rules('title', 'Title', 'required');
        $this->form_validation->set_rules('description', 'Description', 'max_length[255]');
 
 
        if ($this->form_validation->run())
        {
            $todo = array(
                    'name'=>$this->input->post('title'),
                    'description'=>$this->input->post('description')
                    );
            $this->Todo_model->add($todo);
 
            $this->session->set_flashdata('message', 'Done. You have added new task.');            
            redirect('/');
        }
        else
        {
            $this->load->view('todo/add');
        }
    }
}
?>

View

First, we have to update our index.php. Open system/application/views/todo/index.php, change to this following code. Note that we are adding add form link, and set to display flash message.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37

<html>
    <head>
        <title>CodeIgniter To Do List Application</title>
    </head>
<body>
 
<h1>Welcome to CodeIgniter To Do List Application!</h1>
 
<?= anchor('todo/add/', 'Add new to do', array('title' => 'Add new to do!')); ?>
 
<p><?= $flash_message ?></p>
 
<h2>Next</h2>
<?php if($todo_list): ?>
<ul>
    <?php foreach($todo_list as $todo): ?>
    <li><h3><?= $todo->name ?></h3>
    <?php if($todo->description): ?><p><?= $todo->description ?></p><?php endif ?>
    </li>
    <?php endforeach ?>
</ul>
<?php else: ?>
None
<?php endif ?>
 
<h2>Completed</h2>
<?php if($completed_list): ?>
<ul>
    <?php foreach($completed_list as $todo): ?>
    <li><h3><?= $todo->name ?></h3>
    <?php endforeach ?>
</ul>
<?php else: ?>
None
<?php endif ?>
</body>
</html>

Create file add.php under system/application/views/todo/, and add this following code.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19

<html>
<head>
	<title>Add new to do</title>
</head>
<body>
<h1>Add new to do</h1>
 
<?php echo validation_errors(); ?>
 
<form method="post" action="<?php echo site_url('todo/add')?>" >
    <label>Title</label><br/>
    <input type="text" name="title" value="<?php echo set_value('title'); ?>" /><br/>
    <label>Description</label><br/>
    <textarea name="description"><?php echo set_value('description'); ?></textarea><br/>
    <input type="submit" value="Add to do"/><br/>
</form>
 
</body>
</html>

Now you can add new task to your to do list application. See you in the next CodeIgniter tutorial.

Source code for this tutorial : todo2

Related posts:

  1. CodeIgniter Tutorial – To do list application part 3
  2. Codeigniter tutorial – To do list application
  3. CodeIgniter Tutorial – ORM with DataMapper
  4. CakePHP ACL Tutorial – What and How
  5. CodeIgniter Tutorials to Help You Get Started

Tags: ,

One Comment

  • Arch Mangle says:
    March 26, 2009 at 1:19 pm

    Excellent series of tutorials :-) Please keep it up. I’m currently climbing the CI learning curve and your tutorial is really helpful.