Zend_Form Decorators使用实例

Zend Framework官方实例ZendFrameworkQuickstart里面关于继承Zend_Form的使用

一、代码如下：

        // Set the method for the display form to POST
        $this->setMethod('post');
        
        // Add an email element
        $this->addElement('text', 'email', array(
                'label'      => 'Your email address:',
                'required'   => true,
                'filters'    => array('StringTrim'),
                'validators' => array(
                        'EmailAddress',
                )
        ));
        
        // Add the comment element
        $this->addElement('textarea', 'comment', array(
                'label'      => 'Please Comment:',
                'required'   => true,
                'validators' => array(
                        array('validator' => 'StringLength', 'options' => array(0, 20))
                )
        ));
        
        // Add a captcha
        $this->addElement('captcha', 'captcha', array(
                'label'      => 'Please enter the 5 letters displayed below:',
                'required'   => true,
                'captcha'    => array(
                        'captcha' => 'Figlet',
                        'wordLen' => 5,
                        'timeout' => 300
                )
        ));
        
        // Add the submit button
        $this->addElement('submit', 'submit', array(
                'ignore'   => true,
                'label'    => 'Sign Guestbook',
        ));
        
        // And finally add some CSRF protection
        $this->addElement('hash', 'csrf', array(
                'ignore' => true,
        ));

二、其生成的前端代码如下：

三、问题来了，现在我需要像下面这样的表单代码，该怎么做呢？

四、我们可以像如下设置：

    $form = new Zend_Form;    $form->removeDecorator('htmlTag');    $form->setAction('/index/login')            ->setMethod('post')            ->setAttrib('id', 'login_form');    $username = $form->createElement('text', 'username');    $username->addValidator('alnum')            ->setRequired(TRUE)            ->setLabel('Username')            ->setAttrib('class', 'login_input');    // anonymous function that will generate your image tag    $makeImg = function($content, $element, array $options) {                return '<img src="/images/' . $options['img'] . '" class="' . $options['class'] . ' " alt=""/> ';            };    $username->setDecorators(array(        'ViewHelper',        'Errors',        array('Label', array('class' => 'login_label')),        array('Callback',            array(                'callback' => $makeImg,                'img' => 'user_icon.png',                'class' => 'login_icon',                                    'placement' => 'PREPEND'            )        ),        array('HtmlTag', array('tag' => null, 'class' => 'input_row')),    ));    $form->addElement($username);    $submit = $form->createElement('submit', 'login', array(                'label' => 'Login',                'class' => 'login_submit'                    )    );    $submit->setDecorators(array(        'ViewHelper',        'Errors',        array('HtmlTag', array('tag' => null, 'class' => 'input_row')),    ));    $form->addElement($submit);

五、假如我想有如下效果：

设置如下：

 $firstname = new Zend_Form_Element_Text('FirstName');        $firstname->setLabel('FirstName')                 ->setRequired(true)                 ->addFilter('StripTags')                 ->addFilter('StringTrim')                 ->addErrorMessage('Error in First Name')                 ->addValidator('NotEmpty');

$firstname->setDecorators(array(        'ViewHelper',        'Description',        'Errors',        array('HtmlTag', array('tag' => 'div', 'class' => 'fieldItemValue')),        array(array('labelDivOpen' => 'HtmlTag'),               array('tag' => 'div',                     'placement' => 'prepend',                     'closeOnly' => true)),        'Label',        array(array('labelDivClose' => 'HtmlTag'),               array('tag' => 'div',                     'class' => 'fieldItemLabel',                     'placement' => 'prepend',                     'openOnly' => true)),        array(array('fieldDiv' => 'HtmlTag'),               array('tag' => 'div', 'class' => 'field50Pct')),        array(array('divClear' => 'HtmlTag') ,               array('tag' => 'div' ,                    'class' => 'clear',                    'placement' => 'append'))    ));

六、我们可以使用viewScript来实现

Form Element:

$this->addElement('file', 'upload_file', array(    'disableLoadDefaultDecorators' => true,    'decorators' => array('File', array('ViewScript', array(        'viewScript' => '_form/file.phtml',        'placement' => false,    ))),    'label' => 'Upload',    'required' => false,    'filters' => array(),    'validators' => array(array('Count', false, 1),),));

自定义View Script:_form/file.phtml如下

<?php$class .= 'field ' . strtolower(end(explode('_',$this->element->getType())));if ($this->element->isRequired()) {    $class .= ' required';}if ($this->element->hasErrors()) {    $class .= ' errors';}?><div class="<?php echo $class; ?>" id="field_<?php echo $this->element->getId(); ?>">    <?php if (0 < strlen($this->element->getLabel())): ?>        <?php echo $this->formLabel($this->element->getFullyQualifiedName(), $this->element->getLabel());?>    <?php endif; ?>    <span class="value"><?php echo $this->content; ?></span>    <?php if ($this->element->hasErrors()): ?>        <?php echo $this->formErrors($this->element->getMessages()); ?>    <?php endif; ?>    <?php if (0 < strlen($this->element->getDescription())): ?>        <p class="hint"><?php echo $this->element->getDescription(); ?></p>    <?php endif; ?></div>

例如，举个再简单的例子，若view Script,_form/file.phtml为如下内容：

<label for="<?php echo $this->element->getName(); ?>" class="element <?php if ($this->element->hasErrors()): ?> error<?php endif; ?>" id="label_<?php echo $this->element->getName(); ?>">     <span><?php echo $this->element->getLabel(); ?></span>    <?php echo $this->content; ?>    <?php if ($this->element->hasErrors()): ?>    <span class="error">        <?php echo $this->formErrors($this->element->getMessages()); ?>    </span><?php endif; ?></label>

则渲染的内容为：

<label for="photo" class="element" id="label_photo">     <span>Photo</span>    <input type="hidden" name="MAX_FILE_SIZE" value="6291456" id="MAX_FILE_SIZE">    <input type="file" name="photo" id="photo"></label>

七、也可以使用配置文件去实现，如下

myform.ini

method = "post"elements.title.type = "text"elements.title.options.label = "Title"elements.title.options.attribs.size = 40elements.title.options.required = trueelements.image.type = "file"elements.image.options.label = "Image"elements.image.options.validators.isimage.validator = "IsImage"elements.submit.type = "submit"elements.submit.options.label = "Save"

TestController

<?phpclass Admin_TestController extends Zend_Controller_Action{  public function testAction ()  {    $config = new Zend_Config_Ini(MY_SECRET_PATH . 'myform.ini');    $f = new Zend_Form($config);    if ($this->_request->isPost()){      $data = $this->_request->getPost();      $imageElement = $f->getElement('image');      $imageElement->receive();      //$imageElement->getValue();      if ($f->isValid($data)){        //save data        $this->_redirect('/admin');      }    }    $this->view->form = $f;  }}?>

八、对于radio标签的修饰

$this->addElement('radio', 'prop_type', array(
                'decorators' => array(
                        'ViewHelper',
                        array(array('AddTheLi' => 'HtmlTag'), array('tag' => 'li')),
                        array(array('AddTheUl' => 'HtmlTag'), array('tag' => 'ul')),
                        'Errors',
                        array('Description', array('tag' => 'p', 'class' => 'description')),
                        array('Label', array('tag' => 'div')),
                        array('HtmlTag', array('tag' => 'div')),
                ),
                'disableLoadDefaultDecorators' => true,
                'label' => '属性值类型：',
                'separator' => '</li><li>',
                'attribs' => array(
                        'options' => array(
                                'foo' => 'Option 1',
                                'bar' => 'Option 2',
                                'baz' => 'Option 3'
                        ),
                ),
        ));