Symfony2學習筆記之表單

huidaoli發表於2014-08-06



對於一個Web開發者來說,處理HTML表單是一個最為普通又具挑戰的任務。Symfony2整合了一個Form元件,讓處理表單變的容易起來。在這一節裡,我們將
從基礎開始建立一個複雜的表單,學習表單類庫中最重要的內容。

Symfony2 的Form元件是一個獨立的類庫,你可以在Symfony2專案之外使用它。

建立一個簡單的表單:
假設你要建立一個應用程式的todo列表,需要顯示一些任務。因為你的使用者需要編輯和建立任務,所以你需要建立一個表單。在你開始之前,首先來看通用的Task類,用來表示和儲存一個單一任務的資料:

複製程式碼
// src/Acme/TaskBundle/Entity/Task.php
namespace Acme\TaskBundle\Entity;

class Task
{
    protected $task;

    protected $dueDate;

    public function getTask()
    {
        return $this->task;
    }
    public function setTask($task)
    {
        $this->task = $task;
    }

    public function getDueDate()
    {
        return $this->dueDate;
    }
    public function setDueDate(\DateTime $dueDate = null)
    {
        $this->dueDate = $dueDate;
    }
}
複製程式碼

如果你是按照我們提供的示例編碼,那麼你需要先建立一個AcmeTaskBundle:

$ php app/console generate:bundle --namespace=Acme/TaskBundle

該類是一個普通的PHP物件類,因為他們沒有任何Symfony或者其它類庫引用。非常簡單的一個PHP物件類,它直接解決的是你程式中表現task的資料。當然,在本節的最後,你將能夠通過HTML表單提交一個Task例項資料,校驗它的數值,並把它持久化到資料庫。

建立一個Form
現在已經建立了一個Task類,下一步就是建立和渲染一個真正的HTML表單了。在symfony2中,它是通過建立一個表單物件並渲染到模板的。現在,可以從controller內部處理form。

複製程式碼
//src/Acme/TaskBundle/Controller/DefaultController.php

namespace Acme\TaskBundle\Controller;

use Symfony\Bundle\FrameworkBundle\Controller\Controller;
use Symfony\Component\HttpFoundation\Request;
use Acme\TaskBundle\Entity\Task;

class DefaultController extends Controller
{
       //建立一個任務並給它一些假資料作為示例
       $task = new Task();
       $task->setTask('Write a blog post');
       $task->setDueDate(new \DateTime('tomorrow'));

       $form = $this->createFormBuilder($task)
             ->add('task','text')
             ->add('dueDate','date')
             ->getForm();

        return $this->render('AcmeTaskBundle:Default:new.html.twig',array(
               'form' =>$form->createView(),
        ));
}
複製程式碼

上面的示例顯示瞭如何直接在Controller中建立一個表單,為了可以讓表單重用你完全可以在一個單獨的類檔案中建立表單。

因為Symfony2通過一個表單生成器“form builder"來建立表單物件,所以你可以使用很少的程式碼就能完成建立表單任務。表單生成器的目的是讓你能編寫簡單的表單建立方法,讓它來負責繁重的建立任務。

在這個示例中,你已經新增了兩個欄位到你的表單,一個是task一個是dueDate。它們關聯到Task類的task和dueDate屬性。你已經為它們分別指定了型別(比如,text,date等),由這些型別來決定為這些欄位生成什麼樣的HTML表單標籤。

Symfony2 擁有許多內建的型別,接下來我們將簡單的介紹。


渲染一個表單
表單建立以後,下一步就是渲染它。這是通過傳遞一個特定的表單”view"物件(就是上例中的 $form->createView()返回的view物件)到你的模板並通過一些列的表單幫助函式來實現的。
Twig格式:

{# src/Acme/TaskBundle/Resources/views/Default/new.html.twig #}
<form action="{{ path('task_new') }}" method ="post" {{ form_enctype(form) }}>
    {{ form_widget(form) }}

     <input type="submit" />
</form>

PHP程式碼格式:

<!-- src/Acme/TaskBundle/Resources/views/Default/new.html.php -->
<form action="<?php echo $view['router']->generate('task_new') ?>" method="post" <?php echo $view['form']->enctype($form) ?> >
     <?php echo $view['form']->widget($form) ?>

     <input type="submit" />
</form>

在這裡假設你已經建立了一個名叫task_new的路由指向AcmeTaskBundle:Default:new Controller。

就是這些了,通過列印form_widget(form),表單中的每個欄位都會被渲染出來。同時還有一個文字標籤和錯誤資訊。是不是很簡單,不過現在它還不夠靈活。通常情況下,我們渴望單獨渲染表單中的每一個欄位,這樣我們可以更好的控制表單的樣式。我們會在在模板中渲染表單一節介紹。

在繼續下去之前,我們注意到,為什麼我們渲染出來的task輸入框中有一個來自$task物件的屬性值“Write a blog post"。這是表單的第一個工作:從一個物件中獲取資料並把它轉換為合適的格式渲染到一個HTML表單中。
注意,表單系統已經足夠聰明,它們能夠通過像getTask()和setTask()方法來訪問Task類中受保護的屬性task。除非一個是公共屬性,否則必須有一個getter和setter方法被定義來用於表單元件從這些屬性中獲取和保持資料。對於布林型的屬性,你可以使用一個”isser"方法(比如 isPublished())替代getter方法(getPublished())。

 

處理表單提交
表單系統的第二個任務就是傳遞使用者提交的資料回到一個物件的屬性中。要做到這一點,使用者提交的資料必須繫結到表單才行。新增如下程式碼到你的Controller類:

複製程式碼
//...

public function newAction(Request $request)
{
         //只是建立一個新的$task物件(不需要假資料)
        $task = new Task();

        $form= $this->createFormBuilder($task)
              ->add('task','text')
              ->add('dueDate','date')
              ->getForm();

        if($request->getMethod() == "POST"){
              $form->bindRequest($request);

              if($form->isValid()){
                     //執行一些行為,比如保持task到資料庫
                     return $this->redirect($this->generateUrl('task_success'));
              }
        }

       //...
}
複製程式碼

現在,當表單被提交時,Controller可以繫結被提交的資料到表單,表單會把資料傳回$task物件的task和dueDate屬性。這些都在bindRequest()方法中完成。只要bindRequest()方法被呼叫,提交的資料就會立刻被傳輸到底層物件。不管資料是否被真正的校驗通過。

controller一般會遵循一個通用的模式來處理表單,它有三個可能的途徑:
1.當在瀏覽器初始載入一個頁面時,請求方法是GET,表單處理僅僅是建立和渲染。
2.當使用者提交帶有不合法資料的表單(方法為POST)時,表單會並繫結然後渲染,這時候顯示所有校驗錯誤。
3.當使用者提交的表單帶有的資料均合法時,表單繫結並且在頁面跳轉之前你有機會去使用資料去執行一些業務邏輯活動,比如持久化它到資料庫)。

 

表單校驗
在前面我們提到了,如何提交一個帶有合法資料和非法資料的表單。在Symfony2中,校驗是在底層物件上進行的。換句話說,form表單合法與否不重要,主要看在表單提交資料以後,底層物件比如$task物件是否合法。呼叫$form->isvalid() 是一個詢問底層物件是否獲得合法資料的快捷方式。

校驗是通過新增一些列規則(約束)到一個類來完成的。我們給Task類新增規則和約束,使它的task屬性不能為空,duDate欄位不能空並且是一個合法的DateTime物件。
YAML格式:

複製程式碼
# Acme/TaskBundle/Resources/config/validation.yml
Acme\TaskBundle\Entity\Task:
    properties:
        task:
            - NotBlank: ~
        dueDate:
            - NotBlank: ~
            - Type: \DateTime
複製程式碼

在Task類中宣告格式:

複製程式碼
// Acme/TaskBundle/Entity/Task.php
use Symfony\Component\Validator\Constraints as Assert;

class Task
{
    /**
     * @Assert\NotBlank()
     */
    public $task;

    /**
     * @Assert\NotBlank()
     * @Assert\Type("\DateTime")
     */
    protected $dueDate;
}
複製程式碼

XML格式:

複製程式碼
<!-- Acme/TaskBundle/Resources/config/validation.xml -->
<class name="Acme\TaskBundle\Entity\Task">
    <property name="task">
        <constraint name="NotBlank" />
    </property>
    <property name="dueDate">
        <constraint name="NotBlank" />
        <constraint name="Type">
            <value>\DateTime</value>
        </constraint>
    </property>
</class>
複製程式碼

PHP程式碼格式:

複製程式碼
// Acme/TaskBundle/Entity/Task.php
use Symfony\Component\Validator\Mapping\ClassMetadata;
use Symfony\Component\Validator\Constraints\NotBlank;
use Symfony\Component\Validator\Constraints\Type;

class Task
{
    // ...

    public static function loadValidatorMetadata(ClassMetadata $metadata)
    {
        $metadata->addPropertyConstraint('task', new NotBlank());

        $metadata->addPropertyConstraint('dueDate', new NotBlank());
        $metadata->addPropertyConstraint('dueDate', new Type('\DateTime'));
    }
}
複製程式碼

就是這樣了,如果你現在再提交包含非法資料的表單,你將會看到相應的錯誤被列印在表單上。

 

HTML5 校驗
作為HTML5,許多瀏覽器都加強了客戶端某些校驗約束。最常用的校驗活動是在一個必須的欄位上渲染一個required屬性。對於支援HTML5的瀏覽器來說,如果使用者此時提交一個空欄位到表單時,瀏覽器會顯示提示資訊。生成的表單廣泛吸收了這些新內容的優點,通過新增一些HTML屬性來監控校驗。客戶端校驗可以通過新增novalidate屬性到form標籤或者formnovalidate 到提交標籤而關閉。這對你想檢查服務端校驗規則時非常有用。

 


校驗分組
如果你的物件想從校驗組中受益,你需要指定你的表單使用哪個校驗組。

$form = $this->createFormBuilder($users, array(
    'validation_groups' => array('registration'),
))->add(...)
;

如果你建立表單類,你需要新增羨慕的getDefaultOptions()方法:

public function getDefaultOptions(array $options)
{
    return array(
        'validation_groups' => array('registration')
    );
}

在這兩種情況下,只有registration 校驗組將被用於校驗底層物件。


內建欄位型別
Symfony標準版含有大量的欄位型別,它們幾乎涵蓋了所有通用表單的欄位和資料型別。

文字欄位:

text
textarea
email
integer
money
number
password
percent
search
url

選擇欄位:

choice
entity
country
language
locale
timezone

日期和時間欄位:
date
datetime
time
birthday


其它欄位:
checkbox
file
radio


欄位組:
collection
repeated

隱藏欄位:
      hidden
      csrf

基礎欄位:
       field
       form

當然,你也可以定義自己的欄位型別。


欄位型別選項
每一個欄位型別都有一定數量的選項用於配置。比如,dueDate欄位當前被渲染成3個選擇框。而日期欄位可以被配置渲染成一個單一的文字框,使用者可以輸入字串作為日期。

->add('dueData','data', array('widget' = 'single_text'))

required選項:

最常用到的選項是required選項,它可以應用於任何欄位。預設情況下它被設定為true。這就意味著支援HTML5的瀏覽器會使用客戶端校驗來判斷欄位是否為空。如果你不想讓它發生,或者把在你的欄位上把required選項設定為false,或者關閉HTML5校驗。設定required為true並不意味著服務端校驗被應用。換句話說,如果使用者提交一個空數值到該欄位,它將接受這個控制除非你使用Symfony的NotBlank或者NotNull校驗約束。也就是說,required選項是很好,但是服務端校驗還是要繼續用。


label選項:
表單欄位可以使用label選項設定顯示字元標籤,可以應用於任何欄位:

->add('dueDate', 'date',array(
   'widget' =>'single_text',
   'label' => 'Due Date',
))

欄位型別猜測:

現在你已經新增了校驗後設資料到Task類,Symfony早已經瞭解一點關於你的欄位了。如果你允許,Symfony可以猜到你的欄位資料型別併為你設定它。在下面的例子中,Symfony可以根據校驗規則猜測到task欄位是一個標準的text欄位,dueDate是date欄位。

複製程式碼
public function newAction()
{
    $task = new Task();

    $form = $this->createFormBuilder($task)
        ->add('task')
        ->add('dueDate', null, array('widget' => 'single_text'))
        ->getForm();
}
複製程式碼

當你省略了add方法的第二個引數(或者你輸入null)時,Symfony的猜測能力就起作用了。如果你輸入一個選項陣列作為第三個引數(比如上面的dueDate),那麼這些選項會成為Symfony猜測的依據。如果你的表單使用了指定的校驗陣列,欄位型別猜測器將還是要考慮所有的校驗規則來綜合猜測你的欄位型別。


欄位型別可選項猜測
除了猜測欄位型別,Symfony還能是這猜測一些可選項欄位值。當這些可選項被設定時,欄位將會被渲染到特定HTML屬性中,讓HTML5客戶端來提供校驗。
然而,它們不會在服務端生成相應的校驗規則。儘管你需要手動的在服務端新增這些規則,但是這些欄位型別選項還是能根據這些資訊猜測到。

     required: required規則可以在校驗規則或者Doctrine後設資料的基礎上猜測到。這當你的客戶端校驗將自動匹配你的校驗規則時很有用。
     max_length: 如果欄位是一些列文字欄位,那麼max_length選項可以從校驗規則或者Doctrine後設資料中猜到。

     如果你喜歡改變一個猜到的數值,你可以通過在可選項陣列中傳遞該選項來重寫它。

->add('task',null, array('max_length'=>4))

 

在模板中渲染表單
到目前為止,我們已經看了一個完整的表單是如何通過一行程式碼被渲染的。當然,你通常需要更加靈活的渲染方式:
Twig格式:

複製程式碼
{# src/Acme/TaskBundle/Resources/views/Default/new.html.twig #}

<form action="{{ path('task_new') }}" method="post" {{ form_enctype(form) }}>
    {{ form_errors(form) }}

    {{ form_row(form.task) }}
    {{ form_row(form.dueDate) }}

    {{ form_rest(form) }}

    <input type="submit" />
</form>
複製程式碼

PHP程式碼格式:

複製程式碼
<!-- // src/Acme/TaskBundle/Resources/views/Default/newAction.html.php -->

<form action="<?php echo $view['router']->generate('task_new') ?>" method="post" <?php echo $view['form']->enctype($form) ?>>
    <?php echo $view['form']->errors($form) ?>

    <?php echo $view['form']->row($form['task']) ?>
    <?php echo $view['form']->row($form['dueDate']) ?>

    <?php echo $view['form']->rest($form) ?>

    <input type="submit" />
</form>
複製程式碼

讓我們看看這組程式碼的詳細:

form_enctype(form) 只要有一個欄位是檔案上傳,那麼它就會義務的設定為 enctype="multipart/form-data";
form_errors(form) 渲染任何整個form的任何錯誤資訊(特定欄位的錯誤,會顯示在每個欄位的下面一行)。
form_row(form.dueDate) 預設情況下,為給定的欄位在一個div中渲染一個文字標籤,任何錯誤,和HTML表單部件。
form_rest(form) 渲染沒有指出的其餘任何欄位,通常在表單的末尾呼叫它防止遺忘或者渲染一些你不願意手動設定的隱藏欄位。它同時還能為我們提供CSRF保護。

大部分工作是由form_row幫助方法類完成的,它預設在一個div中為每個欄位渲染顯示標籤,錯誤資訊和HTML表單部件。
注意,你可以通過form.vars.value 來訪問你當前是表當資料:
Twig格式:

{{ form.vars.value.task }}

PHP程式碼格式:

<?php echo $view['form']->get('value')->getTask() ?>

 

 

手工渲染每一個表單欄位
form_row幫助器能讓你很快的渲染你表單中的每一個欄位,並且每一行可以被自定義化。但是生活不總是那麼簡單的,你也可能要手動的渲染每一個欄位。
Twig格式:

複製程式碼
{{ form_errors(form) }}

<div>
    {{ form_label(form.task) }}
    {{ form_errors(form.task) }}
    {{ form_widget(form.task) }}
</div>

<div>
    {{ form_label(form.dueDate) }}
    {{ form_errors(form.dueDate) }}
    {{ form_widget(form.dueDate) }}
</div>

{{ form_rest(form) }}
複製程式碼

PHP程式碼格式:

複製程式碼
<?php echo $view['form']->errors($form) ?>

<div>
    <?php echo $view['form']->label($form['task']) ?>
    <?php echo $view['form']->errors($form['task']) ?>
    <?php echo $view['form']->widget($form['task']) ?>
</div>

<div>
    <?php echo $view['form']->label($form['dueDate']) ?>
    <?php echo $view['form']->errors($form['dueDate']) ?>
    <?php echo $view['form']->widget($form['dueDate']) ?>
</div>

<?php echo $view['form']->rest($form) ?>
複製程式碼

如果自動生成顯示標籤不準確,那麼你可以顯式的指定它:

Twig格式:

{{ form_label(form.task, 'Task Description') }}

PHP程式碼格式:

<?php echo $view['form']->label($form['task'], 'Task Description') ?>

一些欄位型別有一些額外的渲染選項可以傳入widget,一個常用的選項為attr,它允許你修改表單元素的屬性。下面的示例將新增task_field class到渲染的文字輸入欄位:
Twig格式:

{{ form_widget(form.task, {'attr': {'class':'task_field'} }) }}

PHP程式碼格式:

<?php echo $view['form']->widget($form['task'], array(
'attr' => array('class' => 'task_field'),
)) ?>

如果你想手工渲染表單欄位,你可以單獨訪問每個欄位的值,比如id,name和label,這裡我們獲取id

Twig格式:

{{ form.task.vars.id }}

PHP程式碼格式:

<?php echo $form['task']->get('id') ?>

需要獲取表單欄位名稱屬性你需要使用full_name值:
Twig格式:

{{ form.task.vars.full_name }}

PHP程式碼格式:

<?php echo $form['task']->get('full_name') ?>

 

 

建立表單類
正如你看到的,一個表單可以直接在controller類中被建立和使用。然而,一個更好的做法是在一個單獨的PHP類中建立表單。它可以被重用到你應用程式的任何地方。建立一個新類來儲存生成task表單的邏輯:

複製程式碼
// src/Acme/TaskBundle/Form/Type/TaskType.php

namespace Acme\TaskBundle\Form\Type;

use Symfony\Component\Form\AbstractType;
use Symfony\Component\Form\FormBuilder;

class TaskType extends AbstractType
{
    public function buildForm(FormBuilder $builder, array $options)
    {
        $builder->add('task');
        $builder->add('dueDate', null, array('widget' => 'single_text'));
    }

    public function getName()
    {
        return 'task';
    }
}
複製程式碼

這個新類包含了所有建立一個task表單所需要的內容,注意getName()方法將返回一個該表單型別的唯一標識,用於快速建立該表單。

複製程式碼
// src/Acme/TaskBundle/Controller/DefaultController.php

// 在類上新增這個新的引用語句
use Acme\TaskBundle\Form\Type\TaskType;

public function newAction()
{
       $task = // ...
       $form = $this->createForm(new TaskType(), $task);

       // ...
}
複製程式碼

 

設定data_class
每個表單都需要知道它底層儲存資料的類名稱,(比如Acme\TaskBundle\Entity\Task)。通常情況下,是根據createForm方法的第二個引數來猜測的。以後,當你開始嵌入表單時,這個可能就不怎麼充分了,所以,通常一個好的方法是通過新增下面程式碼到你的表單型別類來顯式的指定data_class 選項。

public function getDefaultOptions(array $options)
{
      return array(
               'data_class' => 'Acme\TaskBundle\Entity\Task',
      );
}

當然,這種做法也不總是必須的。


當你對映表單到一個物件是,所有的欄位都被對映。 表單的任何欄位如果在對映的物件上不存在那麼就會造成丟擲異常。在這種情況下,你需要在表單中獲取欄位(比如,一個“你同意這些說法嗎?”核取方塊)將不能對映到底層物件,那麼你需要設定property_path為false以避免丟擲異常。

public function buildForm(FormBuilder $builder, array $options)
{
          $builder->add('task');
          $builder->add('dueDate', null, array('property_path' => false));
}

另外,如果有任何的表單欄位沒有被包含著提交的資料中,那麼這些欄位需要顯式的設定為null。


在controller類中我們可以訪問欄位資料:

$form->get('dueDate')->getData();

 

 

Forms和Doctrine
表單的目的是把資料從一個底層物件傳遞給一個HTML表單然後把使用者提交的資料傳回到原先的底層物件。因此,底層物件把資料持久化到資料庫就跟表單沒有任何的關係了。但是,如果你已經配置了底層類是通過Doctrine來持久化,(你已經定義了對映後設資料在底層類),接下來當表單提交資料後,當表單合法後就可以持久化它了。

複製程式碼
if ($form->isValid()) {
    $em = $this->getDoctrine()->getEntityManager();
    $em->persist($task);
    $em->flush();

    return $this->redirect($this->generateUrl('task_success'));
}
複製程式碼

如果處於某種原因,你不想訪問原有的$task物件,你可以從表單中直接獲取資料:

$task = $form->getData();

在這裡,關鍵要理解當表單跟底層物件繫結後,使用者提交的資料會立刻傳遞給底層物件。如果你想持久化這些資料,你只需要持久化物件本身即可。

 

嵌入式表單:(Embedded Forms)
通常,你可能想生成一個表單,它包含來自不同物件的欄位。比如,一個登錄檔單可能包含屬於User物件和Address物件的欄位。幸運的是,這些對於form元件來說都是很容易很自然的事。嵌入一個單獨物件:假設每個Task屬於一個Category物件,首先建立這個Category物件:

複製程式碼
// src/Acme/TaskBundle/Entity/Category.php
namespace Acme\TaskBundle\Entity;

use Symfony\Component\Validator\Constraints as Assert;

class Category
{
    /**
     * @Assert\NotBlank()
     */
    public $name;
}
複製程式碼

接下來,新增一個新的category屬性到Task類:

複製程式碼
// ...

class Task
{
    // ...

    /**
     * @Assert\Type(type="Acme\TaskBundle\Entity\Category")
     */
    protected $category;

    // ...

    public function getCategory()
    {
        return $this->category;
    }

    public function setCategory(Category $category = null)
    {
        $this->category = $category;
    }
}
複製程式碼

現在我們來相應我們應用程式的一個新需求,需要建立一個 表單可以讓使用者修改Category物件。

複製程式碼
// src/Acme/TaskBundle/Form/Type/CategoryType.php
namespace Acme\TaskBundle\Form\Type;

use Symfony\Component\Form\AbstractType;
use Symfony\Component\Form\FormBuilder;

class CategoryType extends AbstractType
{
    public function buildForm(FormBuilder $builder, array $options)
    {
        $builder->add('name');
    }

    public function getDefaultOptions(array $options)
    {
        return array(
            'data_class' => 'Acme\TaskBundle\Entity\Category',
        );
    }

    public function getName()
    {
        return 'category';
    }
}
複製程式碼

我們的最終目的是能夠讓使用者在Task表單中修改Category物件,所以,我們需要新增一個型別為CategoryType表單類的category欄位到TaskType 表單類。

public function buildForm(FormBuilder $builder, array $options)
{
    // ...

    $builder->add('category', new CategoryType());
}

這時我們可以在TaskType類欄位渲染的旁邊渲染CategoryType類的欄位了:

Twig格式:

複製程式碼
{# ... #}

<h3>Category</h3>
<div class="category">
    {{ form_row(form.category.name) }}
</div>

{{ form_rest(form) }}
{# ... #}
複製程式碼

PHP程式碼格式:

複製程式碼
<!-- ... -->

<h3>Category</h3>
<div class="category">
    <?php echo $view['form']->row($form['category']['name']) ?>
</div>

<?php echo $view['form']->rest($form) ?>
<!-- ... -->
複製程式碼

當使用者提交表單時,提交的Category欄位資料被用於建立一個Category例項,然後被設定到Task例項的category欄位。該Category例項可以通過Task例項來訪問,同時也能被持久化到資料或者用作它用。

$task->getCategory()

 

 

嵌入一個表單集合
你也可以將一個表單集合嵌入到一個表單(想象一個Category 表單和許多Product子表單)。它是通過一個欄位型別集合類實現的。

 

表單主題化
表單的每一部分渲染都是可以被自定義個性化的。你可以自由的改變每一個表單行的渲染,改變渲染錯誤的標誌,更或者是textarea標籤應該怎樣顯示等。沒有任何限制,不同的個性化設定能用到不同的區域。

Symfony使用模板渲染每一個或者部分表單,比如label標籤,input標籤,錯誤資訊以及任何其它內容。在Twig中,每個表單片段會被一個Twig block來渲染。要個性化渲染表單,你只需要重寫相應的block即可。在PHP模板中,它是通過單獨的模板檔案來渲染表單片段的,所以你需要通過編寫新的模板來替代舊的模板即可。在理解了它們是怎麼工作的之後,讓我們來個性化form_row片段並新增一個class屬性到包裹每一表單行的div元素。首先建立一個新模板檔案用於存放新的標誌:

Twig格式:

複製程式碼
{# src/Acme/TaskBundle/Resources/views/Form/fields.html.twig #}

{% block field_row %}
{% spaceless %}
    <div class="form_row">
        {{ form_label(form) }}
        {{ form_errors(form) }}
        {{ form_widget(form) }}
    </div>
{% endspaceless %}
{% endblock field_row %}
複製程式碼

PHP程式碼格式:

複製程式碼
<!-- src/Acme/TaskBundle/Resources/views/Form/field_row.html.php -->

<div class="form_row">
    <?php echo $view['form']->label($form, $label) ?>
    <?php echo $view['form']->errors($form) ?>
    <?php echo $view['form']->widget($form, $parameters) ?>
</div>
複製程式碼

field_row表單片段會在通過form_row函式渲染大部分的表單欄位時使用。 要告訴你的表單元件使用你的新的field_row片段,需要新增下面的內容到你渲染該表單的模板頂部:
Twig格式:

複製程式碼
{# src/Acme/TaskBundle/Resources/views/Default/new.html.twig #}

{% form_theme form 'AcmeTaskBundle:Form:fields.html.twig' %}

{% form_theme form 'AcmeTaskBundle:Form:fields.html.twig' 'AcmeTaskBundle:Form:fields2.html.twig' %}

<form ...>
複製程式碼

PHP程式碼格式:

複製程式碼
<!-- src/Acme/TaskBundle/Resources/views/Default/new.html.php -->

<?php $view['form']->setTheme($form, array('AcmeTaskBundle:Form')) ?>

<?php $view['form']->setTheme($form, array('AcmeTaskBundle:Form', 'AcmeTaskBundle:Form')) ?>

<form ...>
複製程式碼

其中的form_theme 標籤匯入前面定義的片段。換句話說,當form_row函式在模板中被呼叫後,它將從你的自定義主題中使用field_row 塊(替代Symfony已有的field_row block)。你的個性化主題不必重寫所有的塊。當渲染一個你沒有重寫過的塊時,主題引起會找全域性的主題(定義在bundle級的主題)使用。

在擁有多個個性化主題的情況下,它會在使用全域性主題之前查詢定製列表。要個性化你表單的任何部分,你只需要重寫相關的片段即可。

 

表單片段命名
在symfony中,表單的每一部分都會被渲染,HTML表單元素,錯誤訊息,顯示標籤等這些都是被定義在基礎主題裡的。它組成了一個Twig的塊集合和一個PHP模板集合。

在Twig中,每個需要的塊都被定義到一個單獨的模板檔案中(form_dive_layout.html.twig),它們被儲存在Twig Bridge裡。在這個檔案中,你可以看到渲染一個表單多需要的每一個block和預設的欄位型別。

在PHP模板中,片段是單獨的模板檔案。 預設情況下它們位於框架bundle的Resources/views/Form 目錄下。每個偏度名稱都遵循相同的基本模式,用一個下劃線(_)分為兩部分,比如:

field_row 用於form_row渲染大部分的欄位
textarea_widget 用於form_widget渲染一個textarea欄位型別
field_errors 用於form_errors渲染一個欄位的錯誤資訊

每個片段都命名都遵循:type_part 模式。type部分對應被渲染的欄位型別(比如textarea,checkbox,date等),而part部分對應著是什麼被渲染(比如label,widget,errors等)
預設情況下,有4種可能的表單part被用來渲染:
label 渲染欄位的標籤 如field_label
widget 渲染欄位的HTML表示 如field_widget
errors 渲染欄位的錯誤資訊 如field_errors
row 渲染欄位的整個行(包括label,widget和errors) 如 filed_row

還有其它3個part型別,分別是rows,rest和enctype,不過這三個一般不會用到。

通過知道欄位型別(比如:textarea)和你想渲染那一部分(比如:widget),你可以建立一個你需要重寫的片段名稱(比如:textarea_widget).


模板片段繼承
在某些情況下,你個性化的片段可能會丟失。比如,在Symfony提供的預設主題中沒有提供textarea_errors片段。那麼如何來渲染一個textarea欄位的錯誤資訊呢?

答案是通過field_errors片段。當Symfony渲染一個textarea型別的錯誤時,它首先查詢一個textarea_errors片段,如果沒有找到則會回到field_errors片段。
每個field型別有一個parenttype(textarea的父型別為field),Symfony如果沒有發現本身的片段,就會轉而使用父類片段。

所以,要重寫textarea欄位的errors,拷貝field_errors片段,重新命名為textarea_errors並個性化它們。為所有欄位重寫預設的error渲染,則需要直接拷貝和個性化field_errors片段。

 

全域性表單主題
在上面的示例中,我們使用了form_theme helper來匯入自定義個的表單片段到表單。你也可以告訴Symfony在全專案中匯入自定義的form。

Twig

為了從所有之前建立的fileds.html.twig模板中自動包含個性化的block,修改你的應用程式配置檔案:

YAML格式:

複製程式碼
# app/config/config.yml

twig:
    form:
        resources:
            - 'AcmeTaskBundle:Form:fields.html.twig'
    # ...
複製程式碼

XML格式:

複製程式碼
<!-- app/config/config.xml -->

<twig:config ...>
        <twig:form>
            <resource>AcmeTaskBundle:Form:fields.html.twig</resource>
        </twig:form>
        <!-- ... -->
</twig:config>
複製程式碼

 

PHP程式碼格式:

複製程式碼
// app/config/config.php

$container->loadFromExtension('twig', array(
    'form' => array('resources' => array(
        'AcmeTaskBundle:Form:fields.html.twig',
     ))
    // ...
));
複製程式碼

現在在fields.html.twig模板中的任何塊都可以被廣泛的使用來定義表單輸出了。

 

自定義表單輸出到一個單一的Twig檔案中
在Twig中,你也可以個性化一個表單塊在模板中

複製程式碼
{% extends '::base.html.twig'%}
{# 匯入"_self" 作為一個表單主題 #}
{% form_theme form _self %}
{# 個性化表單片段 #}
{% block field_row %}
        {# 自定義欄位行輸出 #}
{% endblock field_row %}

{% block content %}
        {# ... #}

        {{ form_row(form.task) }}
{% endblock %}
複製程式碼

這裡{% form_theme form _self %}標籤允許表單塊在使用那些自動化內容的模板中被直接自定義化。使用這個方法來快速的生成個性化輸出。

注意,{% form_theme form _self %}的功能只有在繼承自其它模板時才能起作用,如果不是繼承自其它模板,則需要指出form_theme 到單獨模板中。


PHP
從以前在所有模板中建立的Acme/TaskBundle/Resources/views/Form 目錄自動匯入個性化模板。修改你的配置檔案:
YAML格式:

複製程式碼
# app/config/config.yml

framework:
    templating:
        form:
            resources:
                - 'AcmeTaskBundle:Form'
# ...
複製程式碼

XML格式:

複製程式碼
<!-- app/config/config.xml -->

<framework:config ...>
    <framework:templating>
        <framework:form>
            <resource>AcmeTaskBundle:Form</resource>
        </framework:form>
    </framework:templating>
    <!-- ... -->
</framework:config>
複製程式碼

PHP程式碼格式:

複製程式碼
// app/config/config.php

$container->loadFromExtension('framework', array(
    'templating' => array('form' =>
        array('resources' => array(
            'AcmeTaskBundle:Form',
     )))
    // ...
));
複製程式碼

此時在Acme/TaskBundle/Resources/views/Form目錄中的任何片段都可以全域性範圍內定義表單輸出了。

 

CSRF 保護
CSRF--Cross-site request forgery,跨站偽造請求 是惡意攻擊者試圖讓你的合法使用者在不知不覺中提交他們本不想提交的資料的一種方法。
幸運的是,CSRF攻擊可以通過在你的表單中使用CSRF 記號來阻止。

預設情況下,Symfony自動為你嵌入一個合法的CSRF令牌。這就意味著你不需要做任何事情就可以得到CSRF保護。CSRF保護是通過在你的表單中新增一個隱藏欄位,預設的名叫_token。它包含一個值,這個值只有你和你的使用者知道。這確保了是使用者而不是其它實體在提交資料。Symfony自動校驗該token是否存在以及其準確性。

_token 欄位是一個隱藏欄位並且會自動的渲染,只要你在你的模板中包含了form_rest()函式。它確保了沒有被渲染過的欄位全部渲染出來。CSRF令牌可以按照表單來個性化,比如:

複製程式碼
class TaskType extends AbstractType
{
      // ...

      public function getDefaultOptions(array $options)
      {
           return array(
                   'data_class' => 'Acme\TaskBundle\Entity\Task',
                   'csrf_protection' => true,
                   'csrf_field_name' => '_token',
                   // 一個唯一的鍵值來保證生成令牌
                   'intention' => 'task_item',
           );
      }

      // ...
}
複製程式碼

要關閉CSRF保護,設定csrf_protection 選項為false。intentsion選項是可選的,但為不同的表單生成不同的令牌極大的加強了安全性。


使用一個無底層類表單
大多數情況下,一個表單要繫結一個物件的,並且表單中所有的欄位獲取或者儲存它們的資料到該物件屬性。但有時候,你可能只想使用一個沒有類的表單,返回一個提交資料的陣列,這個非常容易實現:

複製程式碼
// 確認你在類上方匯入了Request物件
use Symfony\Component\HttpFoundation\Request
// ...

public function contactAction(Request $request)
{
        $defaultData = array('message' => 'Type your message here');
        $form = $this->createFormBuilder($defaultData)
              ->add('name', 'text')
              ->add('email', 'email')
              ->add('message', 'textarea')
              ->getForm();

         if ($request->getMethod() == 'POST') {
                $form->bindRequest($request);

                // 資料是一個陣列幷包含 "name", "email", 和"message" 鍵
               $data = $form->getData();
         }

        // ... 渲染表單
}
複製程式碼

預設情況下,一個表單真的假設你想要一個資料陣列而不是資料物件。

這裡有兩種方式你可以改變它的行為並繫結一個物件;
1.當建立表單時傳入一個物件(作為createFormBuilder的第一個引數或者createForm的第二個引數)。
2.在你的表單中宣告data_class 選項

如果以上兩種方式都沒有,那麼表單會返回一個陣列資料。在這個示例中因為$defaultData不是一個物件,又沒有設定data_class選項,則$form->getData()最終返回一個陣列。


你也可以通過Request物件直接訪問POST的值,

$this->get('request')->request->get('name');

注意,大多數的情況下我們使用getData()方法是更好一點的選擇。因為它返回的是經過表單框架轉換過的資料。


新增校驗規則
唯一遺漏的地方就是校驗規則了,通常當你呼叫$form->isvalid()時,物件會呼叫你在類東提供的校驗規則進行校驗。但如果沒有類,你怎麼來新增對你表單資料的約束規則呢?答案是自己建立約束,然後傳入到表單。

複製程式碼
// 在controller類前匯入名稱空間
use Symfony\Component\Validator\Constraints\Email;
use Symfony\Component\Validator\Constraints\MinLength;
use Symfony\Component\Validator\Constraints\Collection;

$collectionConstraint = new Collection(array(
           'name' => new MinLength(5),
           'email' => new Email(array('message' => 'Invalid email address')),
));

// 建立一個表單沒有預設值,傳入約束選項。
$form = $this->createFormBuilder(null, array(
                     'validation_constraint' => $collectionConstraint,
       ))->add('email', 'email')
// ...
;
複製程式碼

現在,當你呼叫$form->bindRequest($request)時,約束就會被建立並作用於你的表單資料。如果你使用表單類,重寫getDefaultOptions 方法來指定可選項:

複製程式碼
namespace Acme\TaskBundle\Form\Type;

use Symfony\Component\Form\AbstractType;
use Symfony\Component\Form\FormBuilder;
use Symfony\Component\Validator\Constraints\Email;
use Symfony\Component\Validator\Constraints\MinLength;
use Symfony\Component\Validator\Constraints\Collection;

class ContactType extends AbstractType
{
    // ...

    public function getDefaultOptions(array $options)
    {
        $collectionConstraint = new Collection(array(
            'name' => new MinLength(5),
            'email' => new Email(array('message' => 'Invalid email address')),
        ));

        return array('validation_constraint' => $collectionConstraint);
    }
}
複製程式碼

這樣你有了足夠的靈活性來建立表單類和約束了,它返回一個資料陣列而不是一個物件。大多數情況下,這個是不錯的,而繫結一個表單到一個物件,從某種程度上說更加健壯。對於簡單表單來說是個不錯的選擇。


總結思考
你現在已經瞭解了所有建造複雜功能性的表單所需要的所有建造塊。當生成表單時,記住一個表單的首要目標是從一個物件把資料傳遞給一個HTML表單以方便使用者修改它們。第二個目標就是把使用者提交的資料重寫提交回物件。

 

參考URL:http://symfony.com/doc/current/book/forms.html

相關文章