本文轉載自：http://www.softeng.cn/?p=53
今天的主要內容是，使用CodeIgniter
框架完整的MVC
內容來做一個簡單的計算器，通過這個計算器，讓大家能夠體會到我在第一節課中所介紹的標准的MVC
框架與用戶交互的一個過程。下面，開始今天的課程。
首先，還是和昨天一樣，解壓下載到的CodeIgniter
框架源碼，更改目錄名稱為CI_02
（如果不會此步驟，請看第一課）並載入工程。在昨天的例子中，大家可以看到，最先被修改的控制器是Welcome
類，可是一般來說，訪問一個網站不應該是先訪問根目錄下的index
頁面嗎？其實這里是CI
框架的一個功能，也是大多數MVC
框架都有的功能，那就是設置默認控制器，在CI
中有很多配置文件，其中在config
文件夾下的routes.php
（路由配置，這里寫的多清楚啊）文件里，大家可以看到這樣一行代碼
$route['default_controller'] = "welcome";
這行代碼的作用就是配置默認的控制器，為了讓大家能夠更好的學習到CI框架，這里，我們將這行代碼修改為
$route['default_controller'] = "calculate";
接下來，我們創建屬於我們自己的calculate控制器，在controllers文件夾下，新建一個php文件，文件名是calculate.php，然后書寫里面的代碼
<?php if ( ! defined('BASEPATH')) exit('No direct script access allowed'); /* * 計算控制器，類名首字母必須大寫，所有的控制器必須繼承自CI_Controller類 */ class Calculate extends CI_Controller { // 構造方法 function __construct() { parent::__construct(); } // 默認方法 function index() { // 加載calculate_view視圖 $this->load->view('calculate_view'); } } /* End of file calculate.php */ /* Location: ./application/controllers/calculate.php */
在上面的代碼中，我們可以注意到，我們的類名與文件名同名，但首字母是大寫的，這是CI
的規則，必須這樣做，而且，所有的控制器都必須要繼承自CI_Controller
類，另外，可以看到，我們在文件結束的地方只有兩行注釋，並沒有PHP
的結束標簽“?>
”，在這里不對此做過多解釋，只是CI
推薦這樣寫，如果大家對這點感興趣，我會在后面的課程中講到。
在上面的控制器當中加載了一個視圖，但是這個視圖現在還沒有，沒關系，現在我們就來動手寫這個視圖，在views
文件夾下新建一個php
文件，文件名為calculate_view.php
，打開文件，書寫具體的代碼
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>網頁計算器</title> <style type="text/css"> #calculators { margin: 10% auto; width:430px; border:1px solid #000; } </style> </head> <body> <div id="calculators"> <form action="index.php/calculate/count" method="post"> <input type="text" name="num1" id="num1" /> <select name="operate" id="operate"> <option value="+">+</option> <option value="-">-</option> <option value="x">x</option> <option value="÷">÷</option> </select> <input type="text" name="num2" id="num2" /> <input type="submit" value="計算" /> </form> </div> </body> </html>
在上面的表單中，我們的提交路徑指向的其實是calculate類中的一個方法，這個方法的名字就是count，關於CI框架路徑的規則，我將在下一講中詳細介紹。接下來，我們來書寫controller中對應的代碼，在calculate控制器中加入如下的函數：
function count() { // 使用輸入類接收參數 $num1 = $this->input->post('num1'); $op = $this->input->post('operate'); $num2 = $this->input->post('num2'); if (is_numeric($num1) && is_numeric($num2)) { // 如果兩個數輸入均為數字，則調用calculate_model模型下的count方法 $result = $this->calculate_model->count($num1, $num2, $op); } }
我們看到在控制器的代碼中，調用了calculate_model模型下面的count方法，但是在調用模型之前，控制器必須先要加載函數，所以，需要在控制器的構造函數中，加入如下代碼：
// 加載計算模型 $this->load->model('calculate_model');
接下來，我們就按照控制器里面的調用，創建我們的calculate_model模型和count方法，所有的模型都是放在models文件夾下的，所以，我們需要在models文件夾下創建一個名為calculate_model.php的文件，創建好后，我們來書寫model端的代碼：
<?php /** * 計算模型，類名首字母必須大寫，所有的模型必須繼承自CI_Model類 */ class Calculate_model extends CI_Model { function __construct() { parent::__construct(); } /* * 計算函數 */ function count($num1, $num2, $op) { if ($op == "+") { return $num1 + $num2; }else if ($op == "-") { return $num1 - $num2; }else if ($op == "x") { return $num1 * $num2; }else if ($op == "÷" && $num2 != 0) { return $num1 / 1.0 / $num2; }else { return FALSE; } } } /* End of file calculate_model.php */ /* Location: ./application/models/calculate_model.php */
現在，已經進行到了模型將計算結果返回給了控制器，還剩最后一步，就構成了一個標准的、完整的MVC框架執行過程，那就是控制器再次加載視圖來顯示計算結果。我們需要在views文件夾下創建一個視圖（PHP文件），取名為result_view.php，代碼如下：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>網頁計算器</title> <style type="text/css"> #calculators { margin: 10% auto; width:430px; border:1px solid #000; } </style> </head> <body> <div id="calculators"> <?php // 從控制器接收數據並對數據進行操作 if (is_numeric($num1) && is_numeric($num2) && $op && $result && $result != FALSE) { echo $num1." ".$op." ".$num2." = ".$result."<br />"; }else { echo "計算錯誤<br />"; } ?> <a href="/CI_02">返回首頁</a> </div> </body> </html>
大家可以注意到，在這個視圖中，出現了PHP代碼，而且出現了一些變量，這些變量是哪來的呢？這就是今天要講到的另一個重點，給視圖添加動態數據。在視圖的使用中，可以通過控制器給視圖添加動態數據，這些數據在控制器里都是以數組鍵值對的形式定義的，在控制器加載視圖的同時，數據數組做為參數傳遞給視圖；在視圖中，我們只需要知道數據在數組中的鍵名就可以取到想要的數據。比如，在控制器里定義的數據數組是：
$data = array('num1' => 1, 'num2' => 2, 'op' => +, 'result' => 3);
那么在視圖中，只需要知道鍵名，就可以取得相對應的數據，比如：
echo $num1." ".$op." ".$num2." = ".$result."<br />";
寫好了用於顯示計算結果的視圖，也學會了怎樣給視圖添加動態數據，現在只需要稍微修改一下前面寫好的控制器的count函數，計算結果就可以顯示在result_view視圖上了，對count函數修改后的代碼如下：
function count() { // 使用輸入類接收參數 $num1 = $this->input->post('num1'); $op = $this->input->post('operate'); $num2 = $this->input->post('num2'); if (is_numeric($num1) && is_numeric($num2)) { // 如果兩個數輸入均為數字，則調用calculate_model模型下的count方法 $result = $this->calculate_model->count($num1, $num2, $op); // 生成要傳給視圖的數據 $data = array('num1' => $num1, 'num2' => $num2, 'op' => $op, 'result' => $result); // 加載視圖 $this->load->view('result_view', $data); } }
可以看到，上面的代碼中，只是將用戶輸入的數字和操作符以及模型返回的計算結果放入data
數組中，然后將數組做為加載視圖時的第二個參數，就可以實現在視圖中顯示計算結果。
看到這里，恭喜你，你已經成功的學會了MVC
框架的基本內容，其實一點都不難，在接下來的課程中，我將逐步講解CI
框架中其他類庫和輔助函數的使用方法。
總結：今天學習了CI
框架的MVC
框架的基本內容，到此位置，MVC
的基本功能已經實現，下一講的內容是URI
以及使用ajax
。
第二課源代碼下載地址：