Code Synthesis
Code Synthesis

Reputation: 473

Zend Framework 2 Adding Form Error CSS Class

I have a simple form in Zend 2, when a validation error occurs I get an unordered list of the errors - how would I go about adding a css class to the ul tag within the confinements of the current code? Ideally I'd like it to do this site wide, so minimal repeated code...

<?php

namespace UserManagement\Form;
use Zend\Form\Form;
use Zend\InputFilter\InputFilterProviderInterface;

class SearchUserForm extends Form implements InputFilterProviderInterface
{
    public function __construct($name = null)
    {
        // we want to ignore the name passed
        parent::__construct('SearchUser');
        $this->setAttribute('method', 'post');
        $this->add(array(
            'name' => 'search',
            'attributes' => array(
                'type'  => 'text',
                'required' => true,
            )
        ));

        $this->add(array(
            'name' => 'submit',
            'attributes' => array(
                'type'  => 'submit',
                'value' => 'Go',
                'id' => 'submitbutton',
            ),
        ));
    }

    public function getInputFilterSpecification()
    {
        return [
            'search' => [
                'required' => true,
                'filters'  => array(
                    array('name' => 'StripTags'),
                    array('name' => 'StringTrim'),
                ),
                'validators' => array(
                    array(
                        'name'    => 'StringLength',
                        'options' => array(
                            'encoding' => 'UTF-8',
                            'min'      => 4,
                            'max'      => 100,
                        ),
                    )
                ),
            ]
        ];
    }

And in the view:

<div class="search">
    <label for="search">Search: </label>
    <?php
        echo $this->form()->openTag($searchForm);
        echo $this->formRow($searchForm->get('search'));
        echo $this->formSubmit($searchForm->get('submit'));
        echo $this->form()->closeTag();
    ?>
</div>

Currently the output of an error is:

<ul>
<li>The input is less than 4 characters long</li>
</ul>

and I'd like:

<ul class='validation-errors'>
<li>The input is less than 4 characters long</li>
</ul>

Upvotes: 1

Views: 845

Answers (2)

bartek_zet
bartek_zet

Reputation: 309

You can configure formElementErrors view helper inside view script.

$this->formElementErrors()
    ->setMessageOpenFormat('<ul class="validation-errors"><li>')
    ->setMessageSeparatorString('</li><li>')
    ->setMessageCloseString('</li></ul>');

It works for view helpers like formElementErrors(), formRow() and formCollection().

Upvotes: 1

briangallagher
briangallagher

Reputation: 539

Rather than using formRow view helper which outputs the label, element, and errors - you can output each using their respective view helpers. The formElementErrors view helper will then allow you to wrap your errors with a specified css class eg:

echo $this->formElementErrors($element, array('class' => 'help-inline'));

Example above taken from official documentation : http://framework.zend.com/manual/2.3/en/modules/zend.form.view.helpers.html#formelementerrors

Upvotes: 2

Related Questions