Custom rendering of FormCollection Elements

A problem with ZF2 forms is that you can’t actually configure the rendering of a form element. Same (stupid) story that was in ZF1 it’s in ZF2 as well. ┬áIf you want to change the rendering the only (idiot) solution is to extend the original rendering helper and that means override the render() function, put the whole code from the original render() function ( and edit it with your changes). The issue is you copy too much code from the framework itself and you should maintain it.

Problem: need to modify the rendering to adapt the HTML to be compatible for Bootstrap3.
Solution:

Extend FormCollection and FormRow. Only one thing to change for the extended FormCollection, just set the $defaultElementHelper:

<?php
namespace ApplicationFormViewHelper;

use ZendFormViewHelperFormCollection;

class FieldCollection extends FormCollection
{
    protected $defaultElementHelper = 'fieldRow';

}

The new FieldCollection will use the view helper called fieldRow:

<?php
namespace ApplicationFormViewHelper;

use ZendFormViewHelperFormRow;
use ZendFormElementInterface;

class FieldRow extends FormRow
{

public function render(ElementInterface $element)
    {
   //.... copy code from FormRow and modify with your changes
  }
}

To be able to call the new helpers, you need to register then as invokables in Module.php

  public function getViewHelperConfig()
    {
        return array(
            'invokables' => array(
                'fieldCollection' => 'ApplicationFormViewHelperFieldCollection',
                'fieldRow' => 'ApplicationFormViewHelperFieldRow'
            ),
           ....
}

My changes were mostly where the markup is created, so in my new FormRow renderer I have something like:

 $markup = '<div class="form-group">'. $labelOpen . $label. $labelClose .
                                    '<div class="col-sm-5"><div class="input-group">'.$elementString .'</div>'.'</div>'.'</div>' ;

and I also set a default class for the label element

 $labelAttributes = array('class'=>'control-label  col-sm-5');

Now in the HTML template we just use

<?php
    echo $this->fieldCollection($formElement);
?>

2 thoughts on “Custom rendering of FormCollection Elements”

  1. Thank you, that was very, VERY helpful.
    One question though: don’t I have to register the new formcollection somewhere? something about invokables… I’m still trying to learn ZF2.

Leave a Reply

Your email address will not be published. Required fields are marked *