撰寫 WEB 應用程式一定會遇到表單的傳送，不論是 EMAIL 寄送表單，會員註冊，或是結帳頁面，通通都是透過表單 POST 資料到後端，如果是企業應用程式就會遇到更多控制用的表單，並且還會牽扯到修改原先內容，更麻煩的還有驗證的問題，雖然可以利用一些 JS 來驗證表單，但是 SERVER 端還是得在驗證一次。

表單式互動式網頁很重要的元素之一

今天我們就用 ZF 的 Form API 來協助我們輕鬆的建立表單，不但可以快速的產生表單，更可以快速的將讀取的內容塞回表單中，也可以在產生表單的時候加入驗證的動作。

首先我們依照 day1 建立一個 ZF 專案

STEP 1 :

首先在 application 建立一個 Forms 資料夾

接著新增一個 PHP CLASS 取名為 Album 並且繼承 Zend_Form

我們簡單實作一個 CD 專輯控管表單

STEP 2 :

我們將建立四個表單元件，並且一口氣加入 FORM 內

^?View Code PHP

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

<?php   require_once ('Zend\Form.php');   class Album extends Zend_Form {   //類別初始化時執行 public function init() { //設定表單名稱為 album $this->setName ( 'album' ); //建立一個 專輯ID 的 隱藏欄位 (不過在這個範例並沒有太大意義) $id = new Zend_Form_Element_Hidden ( 'id' ); //建立一個 歌手 的文字輸入欄位 $artist = new Zend_Form_Element_Text ( 'artist' ); //設定歌手的欄位名稱，設定為必須填寫的CSS，加入兩個過濾器去除空白字元，並且驗證器設定為必填欄位 $artist->setLabel ( '歌手' )->setRequired ( true )->addFilter ( 'StripTags' )->addFilter ( 'StringTrim' )->addValidator ( 'NotEmpty' ); //建立一個 專輯名稱的文字輸入欄位 $title = new Zend_Form_Element_Text ( 'title' ); //設定專輯名稱的欄位名稱，設定為必須填寫的CSS，加入兩個過濾器去除空白字元，並且驗證器設定為必填欄位 $title->setLabel ( '專輯名稱' )->setRequired ( true )->addFilter ( 'StripTags' )->addFilter ( 'StringTrim' )->addValidator ( 'NotEmpty' ); //建立一個 SUBMIT 按鈕 $submit = new Zend_Form_Element_Submit ( 'submit' ); //設定 SUBMIT 按鈕的ID 為 submitbutton $submit->setAttrib ( 'id', 'submitbutton' ); //最後將上述的四個物件一口氣加入表單內 $this->addElements ( array ($id, $artist, $title, $submit ) ); } }   ?>

STEP 3 :

打開 IndexController.php

並且在 IndexAction 增加以下內容

^?View Code PHP

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

<?php   class IndexController extends Zend_Controller_Action {   public function init() { /* Initialize action controller here */ }   public function indexAction() { // action body //載入我們的 FORM 表單 Zend_Loader::loadClass ( "Album", "../application/Forms/" ); //將表單實體化 $form = new Album (); //將表單交給 VIEW 呈現 $this->view->form = $form; //判斷傳入的參數是否為 POST if ($this->getRequest ()->isPost ()) { //將POST資料取回 $formData = $this->getRequest ()->getPost (); //判斷資料是否合法 if ($form->isValid ( $formData )) { //合法就將值顯示在畫面上 $this->view->artist = $form->getValue ( 'artist' ); $this->view->title = $form->getValue ( 'title' ); } else { //不合法就讓使用者重新輸入 $form->populate ( $formData ); } } }   }

STEP 4 :

接著打開 views/scripts/index/index.phtml 檔案

先將原本的範本刪除掉，並且輸入以下內容

^?View Code PHP

1 2 3 4 5

<?php echo $this->form ;?>   以下為您輸入的資料<BR/> 歌手名稱:<?php echo $this->artist ; ?><br/> 專輯名稱:<?php echo $this->title ; ?><br/>

STEP 5 :

最後我們在網址列輸入 http://localhost/day5/public/index.php

我們可以得到以下畫面

我們可以先測試看看沒有輸入字串，並且送出，網頁會回應不可以為空值

接著我們測試再輸入欄位輸入帶有空白並且有 HTML 符號的文字

網頁應該會幫我們去掉特殊符號並且拿掉空白

使用 FORM 表單可以快速的協助我們來建立表單工具

並且包含其 CSS 必須要的一些需要的資料，可以說是相當方便。

當 MVC 與 FORM 還有 LAYOUT 都介紹完了，接下來我們就可以實際跑一個比較完整的範例了。

Random Posts

相關文章 :

• ZF in ∞ days –> day 2 –> ZF not just APIs
• ZF in ∞ days –> day 6 –> Zend Framework 專輯管理程式
• ZF in ∞ days –> day 4 –> 使用 Layout 來排版
• ZF in ∞ days –> day 7 –> Zend Framework Auth 登入驗證
• ZF in ∞ days –> day 3 –> Create a Model

Ausir ZEND framework, 網頁設計 framework, MVC, PHP, Zend, Zend Framework, Zend Framework 教學, ZF