Symfony2 and form theming/customization (required/help/errors)

Question

Maybe I'm overlooking something, and hopefully this is done very easy.

I have a form and what I want in the end is the following result:

Fields which:

• are mandatory/required
• have an error currently
• have help

should get an extra a-Tag after the label and an extra div, filled with the help and/or the error, if applicable.

What I got to work is, that required fields get the a-Tag by using this:

{% use 'form_div_layout.html.twig' with field_label as base_field_label %}

{% block field_label %}
    {{ block('base_field_label') }}

    {% if required %}
        <a href=""><span>&nbsp;</span></a>
    {% endif %}
{% endblock %}

So, what I tried already were different versions of this:

{% use 'form_div_layout.html.twig' with field_label as base_field_label %}

{% block field_label %}
    {{ block('base_field_label') }}

    {% if required or help is defined %}
        <a href=""><span>&nbsp;</span></a>
    {% endif %}
{% endblock %}

{% block field_row %}
    {% spaceless %}
        <div class="row">
            {% if required or help is defined %}
                <div>
                    {{ form_errors(form) }}
                    {{ help }}
                </div>
            {% endif %}

            {{ form_label(form) }}
            {{ form_widget(form, { 'attr': {'class': 'grid_4'} }) }}
        </div>          
    {% endspaceless %}
{% endblock field_row %}

And I can't get this to work.

So my questions are:

• Where do I get the help text from, which can also contain HTML? I tried this within the form builder without success - but at least with an exception:

  $builder    ->add('subject', 'text', array(
      'label' => 'Subject',
      'help' => 'Can be formatted content with <strong>HTML-Elements</strong>',
      ));
  

• How can I tell that the current field has an error (to add a class to the row) and if so also display it? {{ form_errors(form) }} did not output anything, no matter where I place it within `field_row˚.

Answer 1

There is no help text, you have to create Form Extension for field and add it to default options.

Example in SF 2.1 Beta 1:

namespace Webility\Bundle\WebilityBundle\Form\Extension;

use Symfony\Component\Form\FormInterface;
use Symfony\Component\Form\FormViewInterface;
use Symfony\Component\Form\FormBuilderInterface;
use Symfony\Component\Form\AbstractTypeExtension;
use Symfony\Component\OptionsResolver\OptionsResolverInterface;

class HelpFormTypeExtension extends AbstractTypeExtension
{

    public function buildView(FormViewInterface $view, FormInterface $form, array $options){
        $view->setVar('help', $options['help']);
    }

    public function getExtendedType(){
        return 'field';
    }

    public function setDefaultOptions(OptionsResolverInterface $resolver) {
        $resolver->setDefaults(array(
            'help' => null
        ));
    }
}

And register it as a service:

<service id="webility.form.extension.help" class="Webility\Bundle\WebilityBundle\Form\Extension\HelpFormTypeExtension">
        <tag name="form.type_extension" alias="field" />
</service> 

For the errors question: Do you have any errors to print? Check that in controller if validation fails:

echo '<pre>'; print_r( $form->getErrorsAsString() ); echo '</pre>'; exit;

Answer 2

To solve it as stated in my question Maciej Pyszyński's anwser was very helpful.

I solved it in this case in another way, which I also want to post here. According to the manual "Adding "help" messages" I build this:

Note This solution won't work together with the formbuilder and needs some tweaking in twig.

To get the help ''-tags (actually they are divs now) …

{% block field_label %}
    {{ block('base_field_label') }}

    {% if attr.class is defined and '_hint' == attr.class %}
        <div>
            <a><span class="help">Help Icon</span></a>
            <div class="tooltip">
                {% if help is defined %}
                    {{ help|raw }}
                {% else %}
                    Somebody forgot to insert the help message
                {% endif %}
            </div>
        </div>
    {% endif %}
{% endblock %}

To get the right class on an error

{% block field_row %}
    {% spaceless %}
        <div class="row{% if form_errors(form) %} error{% endif %}">
            {{ form_label(form) }}
            {{ form_widget(form, { 'attr': {'class': 'grid_4'} }) }}
        </div>
    {% endspaceless %}
{% endblock field_row %}

And the call from the template

<div class="row{% if form_errors(form.url) %} _error{% endif %}">
    {{ form_label(form.field, null, { 'attr': {'class': '_hint'}, 'help': 'Help text or variable containing it' }) }}
    {{ form_widget(form.field, { 'attr': {'class': 'grid_4'} }) }}
</div>