Custom Form Layouts in Zend Framework
I recently had two layout needs in Zend_Form that I could not solve with “addDisplayGroup.” However, I was able to solve the problems with a custom “viewScript” on the form object. Here were my needs:
- I needed two groups of fieldsets, each contained in a div.
- I needed to add a subform to one of the fieldsets.
My initial thought was to add the subform to a DisplayGroup. That failed miserably. Thanks to an excellent decorators tutorial and the comments below it, though, I was able to set up a viewScript. Below are the steps that I took.
Create the Form
Code
<?php
class Application_Form_File extends Zend_Form {
public function init() {
$this->setName('file')
->setDecorators(array(
array('viewScript', array('viewScript' => 'fileForm.phtml'))
));
$id = new Zend_Form_Element_Hidden('id');
$id->addFilter('Int')
->removeDecorator('label')
->removeDecorator('HtmlTag');
//required
$title = new Zend_Form_Element_Text('title');
$title->setLabel('Title')
->setRequired(true)
->addFilter('StripTags')
->addFilter('StringTrim')
->addValidator('NotEmpty');
$url = new Zend_Form_Element_Text('url');
$url->setLabel('File')
->setRequired(true)
->addFilter('StripTags')
->addFilter('StringTrim')
->addValidator('NotEmpty');
//end required
//strongly recommended
$description = new Zend_Form_Element_Textarea('description');
$description->setLabel('Description')
->setRequired(false)
->addFilter('StripTags')
->addFilter('StringTrim')
->setAttrib('cols', 40);
$authorsSubForm = new Zend_Form_SubForm();
$authorsSubForm->setName('authorsSubForm');
for ( $i = 1; $i <= 4; $i++) {
$author = new Zend_Form_Element_Select ( 'author' );
$author->setLabel ( 'Author #'.$i );
$author->addMultiOption ( 0, "Select one" );
$author->addMultiOption ( 1, "First Example Author" );
$author->addMultiOption ( 2, "Second Example Author" );
$author->addMultiOption ( 3, "Third Example Author" );
$row = new Zend_Form_SubForm();
$row->addElements(array($author, ));
$authorsSubForm->addSubForm($row, $i);
}
//strongly recommended
//functions
$save = new Zend_Form_Element_Submit('submit');
$save->setAttrib('id', 'submitbutton')
->setLabel('Save');
$delete = new Zend_Form_Element_Submit('delete');
$delete->setAttrib('id', 'deletebutton')
->setLabel('Delete this file');
//end functions
$this->addElements(array($id, $title, $url, $description, $save, $delete));
$this->addSubForm($authorsSubForm, 'authorsSubForm');
}
}
Location: application/forms/File.php
I use Zend_Tool to create the form at the location above. There are two major points to note. First, at the top of the init function, I define a custom viewScript for the form. This script replaces the default viewScript for the form, so without it, the form will not generate. In the next section, we will define the viewScript.
Second, in this example, there is no need to use DisplayGroups. We will define the groups, using fieldsets, in the next section.
Create the Custom Viewscript
Code
<form action="<?php echo $this->escape($this->element->getAction()); ?>" method="<?php echo $this->escape($this->element->getMethod()); ?>">
<div class="file_information">
<fieldset>
<legend>Required</legend>
<?php
echo $this->element->id;
echo $this->element->title;
echo $this->element->url;
?>
</fieldset>
<fieldset>
<legend>Strongly Recommended</legend>
<?php
echo $this->element->description;
echo $this->element->authorsSubForm;
?>
</fieldset>
</div>
<div class="functions">
<fieldset>
<legend>Save</legend>
<?php
echo $this->element->submit;
?>
</fieldset>
<fieldset>
<legend>Delete</legend>
<?php
echo $this->element->delete;
?>
</fieldset>
</div>
</form>Location: application/views/scripts/fileForm.phtml
This file is what provides the custom markup. Each element of the form needs to be echoed through the viewScript, so this process is certainly repetitive if custom markup isn’t absolutely necessary. If a form’s element is not echoed, it will not output to the page, even if the element is added in the Zend_Form file.
Conclusion
Custom viewScripts can be quite beneficial when it is necessary to control the markup for a form on a high level. I can also see it being useful as a way to allow a front end developer or designer to control the layout of the form while a back end developer controls validation and processing.
Add new comment