Zend Framework by examples (ZfEx): Create a form

In this example, we create a form with text boxes, select boxes, radio buttons, check boxes, text areas, buttons, and fieldsets. We also use validators, filters and decorators.

Components used in this example

MyForm MyCustomForm MyPwdConfirmation MyHtml Entry point HTML | Try it | View source code

Implementation of the form to fill

We define default values to show as a template.


class MyForm
{

    // We define default values to show as a template.
    private $_defaults = array(
        'confirmation' => 'yourpassword',
        'email' => 'your-address@mail.com',
        'firstname' => 'Your first name here',
        'gender' => 'male',
        'lastname' => 'Your last name here',
        'login' => 'yourlogin',
        'more' => 'Enter more information about you here...',
        'password' => 'yourpassword',
        'profile' => array('house', 'car'),
        'title' => 'mr',
    );

Form processing

We create the form.
If no parameters are passed, we do not validate the form.
If one or more parameters are passed we try to validate the form.
If the user clicked on the reset button, we reset the form.
If the user requested to display the example, we populate the form with the default values.
And we revalidate the form with the default values. The example is expected to be valid!
If the form is not valid, we display the error messages.
If we catch an exception, we return the error message.


    public function process()
    {
        $data = array();

        try {
            // We create the form.
            $form = new MyCustomForm;
            $form
                ->setMethod('post')
                ->setElementFilters(array('StringTrim'))
                ->setIdentity()
                ->setCredentials()
                ->setAction();

            if (empty($_POST)) {
                // If no parameters are passed, we do not validate the form.
                $result = 'Please fill the form and submit!';
            } else {
                // If one or more parameters are passed we try to validate the form.
                $isValid = $form->isValid($_POST);

                if ($isReset = $form->reset->getValue()) {
                    // If the user clicked on the reset button, we reset the form.
                    $form->reset();
                    $result = 'The form has been reset!';

                } else if ($form->example->getValue()) {
                    // If the user requested to display the example,
                    // we populate the form with the default values.
                    $form->populate($this->_defaults);
                    // And we revalidate the form with the default values.
                    // The example is expected to be valid!
                    $form->isValid($form->getValues());
                    $result = 'The form was filled with an example!';

                } else if ($isValid) {
                    $result = 'Your form is valid!';

                } else {
                    // If the form is not valid, we display the error messages.
                    $result = 'Your form has errors!';
                    $form->addDecorator('FormErrors', array('placement' => 'append'));
                }

                $isReset or $data = array(
                    'VALUES' => $form->getValues(),
                    'MESSAGES' => $form->getMessages());
            }


        } catch (Exception $e) {
            // If we catch an exception, we return the error message.
            $result = $e->getMessage();
        }

        return array($form, $result, $data);
    }

Creation of a custom registration form


class MyCustomForm extends Zend_Form
{

Creation of the identity

We add the gender, the title, the first name, the last name, the email address, and other items.
And we group them together.


    public function setIdentity()
    {

        // We add the gender, the title, the first name, the last name,
        // the email address, and other items.

        $gender = $this->buildElement('Gender', 'gender',
            null, false, 'Zend_Form_Element_Radio');
        $gender
            ->addMultiOptions(array('male' => 'Male', 'female' => 'Female'))
            ->setSeparator('');

        $title = $this->buildElement('Title', 'title',
            null, false, 'Zend_Form_Element_Select');
        $title->setMultiOptions(array('' => '', 'mr' => 'Mr', 'mrs' => 'Mrs', 'ms' => 'Ms'));

        $firstName = $this->buildElement('First name', 'firstname', 'name', true);
        $lastName = $this->buildElement('Last name', 'lastname', 'name', true);

        $email = $this->buildElement('Email address', 'email', 'name', true);
        $email
            ->addFilter('StringToLower')
            ->addValidator('EmailAddress');

        $gender = $this->buildElement('Do you have ?', 'profile',
            null, false, 'Zend_Form_Element_MultiCheckbox');
        $gender
            ->addMultiOptions(array(
                'house' => 'A house', 'car' => 'A car', 'bicylcle' => 'A bicycle'))
            ->setSeparator("\n");

        $more = $this->buildElement('Tells us more', 'more',
            'more', false, 'Zend_Form_Element_Textarea');

        // And we group them together.
        $this->buildGroup(
            array('gender', 'title', 'firstname', 'lastname', 'email', 'profile', 'more'),
            'identity', 'Identity');

        return $this;
    }

Creation of the credentials

We add a login, a password and a password confirmation.
And we group them together.


    public function setCredentials()
    {
        // We add a login, a password and a password confirmation.

        $login = $this->buildElement('Login', 'login', null, true);
        $login
            ->addValidator('alnum')
            ->addValidator('regex', false, array('/^[a-z]+/'))
            ->addValidator('stringLength', false, array(6, 10))
            ->addFilter('StringToLower')
            ->setDescription('(a-z lowercase characters only)')
            ->addDecorator('Description', array('tag' => 'span'));

        $password = $this->buildElement('Password', 'password', null, true,
            'Zend_Form_Element_Password');
        $password
            ->addValidator('StringLength', false, array(6))
            ->addValidator(new MyPwdConfirmation)
            ->setRenderPassword(true);

        $confirmation = $this->buildElement('-', 'confirmation', null, false,
            'Zend_Form_Element_Password');
        $confirmation->setRenderPassword(true)
            ->setDescription('Re-enter your password for confirmation')
            ->addDecorator('Description', array('tag' => 'span'));

        // And we group them together.
        $this->buildGroup(
            array('login', 'password', 'confirmation'),
            'credentials', 'Credentials');

        return $this;
    }

Creation of the buttons

We add a submit button, a reset button, and a button to display the example.
And we group them together.


    public function setAction()
    {
        // We add a submit button, a reset button, and a button to display the example.

        $submit = $this->buildButton('Submit', 'submit');
        $reset = $this->buildButton('Reset', 'reset');
        $example = $this->buildButton('Example', 'example')
            ->setDescription('Items with the * suffix are mandatory')
            ->addDecorator('Description', array('tag' => 'span'));

        // And we group them together.
        $this->buildGroup(array('submit', 'reset', 'example'), 'action', null, null);

        return $this;
    }

Creation of an element

We create the element. We set the label, if the element is required or not, the HTML class. We display the element and the label.
We add the element to the form.


    public function buildElement($label, $name, $htmlClass, $required = false, $class = null)
    {
        is_null($class) and $class = 'Zend_Form_Element_Text';

        // We create the element.
        // We set the label, if the element is required or not, the HTML class.
        // We display the element and the label.
        $element = new $class($name);
        $element
            ->setLabel($label)
            ->setRequired($required)
            ->setAttrib('class', $htmlClass)
            ->setOptions(array('requiredSuffix' => '*'))
            ->setDecorators(array(
                array('ViewHelper'),
                array('Label', array('class' => 'label')),
                ));

        // We add the element to the form.
        $this->addElement($element);

        return $element;
    }

Creation of a group of elements

We create the fieldset in the form. The fieldset has a legend, an HTML class, and a separator of elements.


    public function buildGroup($elements, $name, $legend = '',
                               $separator = array('separator' => '<br />'))
    {
        // We create the fieldset in the form.
        // The fieldset has a legend, an HTML class, and a separator of elements.
        $this->addDisplayGroup($elements, $name);
        $this->$name
            ->setLegend($legend)
            ->setAttrib('class', 'group')
            ->addDecorator('FormElements', $separator);

        return $this->$name;
    }

Creation of a button

We create a button with a label.
We add the element to the form.


    public function buildButton($value, $name)
    {
        // We create a button with a label.
        $button = new Zend_Form_Element_Submit($name);
        $button
            ->setLabel($value)
            ->setDecorators(array('ViewHelper'));

        // We add the element to the form.
        $this->addElement($button);

        return $button;
    }

Implementation of a validator of password

The password is valid if the password is the same as the confirmation.


class MyPwdConfirmation extends Zend_Validate_Abstract
{
    const NOT_MATCH = 'notMatch';

    protected $_messageTemplates =
        array(self::NOT_MATCH => 'Password confirmation does not match!');

    public function isValid($value, $context = null)
    {
        $value = (string) $value;
        $this->_setValue($value);

        // The password is valid if the password is the same as the confirmation.

        if (is_array($context)) {
            if (isset($context['confirmation']) and $value == $context['confirmation']) {
                return true;
            }
        } else if (is_string($context) and $value == $context) {
            return true;
        }

        $this->_error(self::NOT_MATCH);

        return false;
    }

Displaying items


class MyHtml
{

Displaying the title of the page based on the file name.


    public static function printTitle()
    {
        $basename = basename(__FILE__, '.php');
        $title = ucwords(str_replace('-' , ' ', $basename));
        $zfVersion = Zend_Version::VERSION;
        $phpVersion = phpversion();
        echo "ZfEx $title (ZF/$zfVersion PHP/$phpVersion)";
    }

Colorization of data

We export the data as valid PHP code.
We add the PHP tag, we colorize the code, we remove the PHP tag.
We display the data.


    public static function colorize($mixed)
    {
        // We export the data as valid PHP code.
        $mixed = var_export($mixed, true);
        // We add the PHP tag, we colorize the code, we remove the PHP tag.
        $mixed = '<?' . "php $mixed";
        $mixed = highlight_string($mixed, true);
        $mixed = str_replace('&lt;?php&nbsp;', '', $mixed);
        // We display the data.
        echo "<pre>$mixed</pre>";
    }

Processing the form

We create the form and we get the result of the validation and the parameters, to display in the page.


// We create the form and we get the result of the validation and the parameters,
// to display in the page.
$myForm = new MyForm();
list($form, $result, $data) = $myForm->process();


<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title><?php MyHtml::printTitle();?></title>
    <style type="text/css">
      body, td {
          font-family: arial, sans-serif;
          font-size: 0.9em;
      }
      textarea.data {
          height: 3em;
          width: 30em;
      }
      .label {
          width: 10em;
          display: block;
          float: left;
      }
      .name {
          width: 20em;
      }
      .group {
          width: 50em;
      }
      .more {
          height: 5em;
          width: 30em;
      }
    </style>
  </head>

  <body>

    <p>EXAMPLE <?php MyHtml::printTitle();?></p>
    <hr />

    <?php echo $form->render(new Zend_View) ?>

    <hr />
    RESULT
    <?php MyHtml::colorize($result, true, false);?>

    <hr />
    DATA
    <?php MyHtml::colorize($data, true, false);?>

  </body>
</html>