使用Zend Form装饰器制作无表格形式

时间:2011-07-23 11:27:23

标签: php forms zend-framework decorator

如果我有以下简单的形式:

<?php

class Application_Form_Contact extends Zend_Form
{
    public function init()
    {
        //set the method for the display form to POST
        $this->setMethod('post');

        //create and add e-mail element
        $email = $this    -> createElement('text', 'username')
                              -> setLabel('E-mail:')
                          -> setRequired(true)
                          -> addFilters(array('StringTrim', 'StringToLower'))
                          -> addValidator('EmailAddress')
                          -> addErrorMessage('U dient een geldig e-mail adres in te vullen.');               
        $this->addElement($email);

        //create and add message element
        $message = $this    -> createElement('textarea', 'message')
                            -> setLabel('Bericht:')
                            -> setRequired(true)
                            -> addValidator('StringLength', array(0, 5000))
                            -> addErrorMessage('U dient een bericht in te vullen van maximaal 5000 tekens.');
        $this->addElement($message);

        //submit button
        $this->addElement('submit', 'submit', array(
            'ignore'    => true,
            'label'     => 'Verstuur Bericht'
        ));
    }
}

?>

默认情况下,这将导致表格布局如下:

    <form enctype="application/x-www-form-urlencoded" method="post" action="/contact"><dl class="zend_form"> 
<dt id="username-label"><label for="username" class="required">E-mail:</label></dt> 
<dd id="username-element"> 
<input type="text" name="username" id="username" value=""></dd> 
<dt id="message-label"><label for="message" class="required">Bericht:</label></dt> 
<dd id="message-element"> 
<textarea name="message" id="message" rows="24" cols="80"></textarea></dd> 
<dt id="submit-label">&#160;</dt><dd id="submit-element"> 
<input type="submit" name="submit" id="submit" value="Verstuur Bericht"></dd> 
</dl></form>

这是非常不必要的,因为一些简单的HTML将导致一个更符合我的喜好的形式(因为textarea在标签下,而电子邮件输入在标签旁边):

<form enctype="application/x-www-form-urlencoded" method="post" action="/contact">

    <p>
        <label id="username-label" for="username" class="required">E-mail:</label>
        <input type="text" name="username" id="username" value="" />
    </p>

    <br />  

    <p>
        <label id="message-label" for="message" class="required">Bericht:</label>
        <br />
        <textarea name="message" id="message" rows="24" cols="80"></textarea>
    </p>

    <input type="submit" name="submit" id="submit" value="Verstuur Bericht" />

</form>

看起来像这样:http://jsfiddle.net/qmKYa/而不是http://jsfiddle.net/rudhA/2/

但是如何让zend不要渲染任何表格,将前两个元素包装在段落标记内并添加两个新行以获得适当的间距?

1 个答案:

答案 0 :(得分:2)

首先,Zend_Form使用装饰器来编写表单。您可以更改现有的默认装饰器,但也可以编写和添加自己的装饰器。查看Zend Reference Guide以获取示例。

关于标签的位置,您可以告诉现有装饰器APPEND或PREPEND到表单元素。

下面是几个关于如何操作现有装饰器的示例。

$element->removeDecorator('DtDdWrapper');

$descriptionDecorator = new Zend_Form_Decorator_Description(array('tag'=>'p','class' => 'description_submit'));
$descriptionDecorator->setOption('placement','PREPEND');
$element->addDecorator($descriptionDecorator);

还有一个现有的Zend_Form_Decorator_Label类,但我没有准备好的示例。