CODEWITHSUNDEEP
symfonycheckboxlabeloverridingtwig
Gilberto Albino
Gilberto Albino

Reputation: 2745

How to show label for overrided checkbox in Symfony Twig

I've overrided the Twig template for my forms in my symfony application so that I could have more control over the labels for checkboxes.

However, I am having problems with the checkbox label.

Here is the code I overrided in my custom template file:

{# Labels #}
{% block form_label %}
    {% spaceless %}
        {% if label is not sameas(false) %}
            {% if not compound %}
                {% set label_attr = label_attr|merge({'for': id}) %}
            {% endif %}
            {% if required %}
                {% set label_attr = label_attr|merge({'class': (label_attr.class|default('') ~ ' required')|trim}) %}
            {% endif %}
            {% if label is empty %}
                {% set label = name|humanize %}
            {% endif %}
        {% endif %}
        {% if 'checkbox' not in block_prefixes %}
             <label{% for attrname, attrvalue in label_attr %} {{ attrname }}="{{ attrvalue }}"{% endfor %}>{{ label|trans({}, translation_domain) }}</label>
        {% endif %}
    {% endspaceless %}
{% endblock form_label %}

{# Checkboxes #}
{% block button_label %}{% endblock %}
{% block checkbox_widget %}
{% spaceless %}
    <label for="{{ id }}">
        <input type="checkbox" {{ block('widget_attributes') }}{% if value is defined %} value="{{ value }}"{% endif %}{% if checked %} checked="checked"{% endif %} />
    {{ label }}</label>
{% endspaceless %}
{% endblock checkbox_widget %}

It works fine but I can't get the label text node for checkboxes working.

When I have a checkbox it generates something like:

<label><input type="checkbox"/></label>

Where it should be:

<label><input type="checkbox"/>Label Here</label>

Any clue on how to make the label string apear after the checkbox?

Edit:

I came to a solution, that worked pretty fine, but I am not sure if it the best.

{% block form_row %}
{% spaceless %}
    <div>
        {{ form_errors(form) }}
        {% if 'checkbox'  in block_prefixes %}
            {{ form_widget(form) }}
            {{ form_label(form) }}
        {% elseif 'radio'  in block_prefixes %}
            {{ form_widget(form) }}
            {{ form_label(form) }}
        {% else %}
            {{ form_label(form) }}
            {{ form_widget(form) }}
        {% endif %}

    </div>
{% endspaceless %}
{% endblock form_row %}

Upvotes: 2

Views: 6344

Answers (1)

oumlaote
oumlaote

Reputation: 133

You can remove the label in {% block choice_widget %} to prevent it from appearing in the default spot.

{% block choice_widget %}
{% spaceless %}
    {% if expanded %}
        <div {{ block('widget_container_attributes') }}>
        {% for child in form %}
            {{ form_widget(child) }}
            {{ form_label(child) }}             {# HERE #}  
        {% endfor %}
        </div>
    {% else %}
//....
{% endspaceless %}
{% endblock choice_widget %}

If you do so, you would have to override the {% block radio_widget %} too. Otherwise it won't have a label.

<label  for="{{ id }}"><input type="radio" {{ block('widget_attributes') }}{% if value is defined %} value="{{ value }}"{% endif %}{% if checked %} checked="checked"{% endif %} />{{ label|trans }}</label>

You can then remove the {% if 'checkbox' not in block_prefixes %} line you put in {% block form_label %}.

It worked for me.

Symfony2 - How to put label and input for checkboxes/radios in a same line?

Edit :

it seems that they split the {% block choice_widget %} in 2.3.3. You have to edit the choice_expanded block now, and remove the label line as above.

{% block choice_widget_expanded %}
{% spaceless %}
    <div {{ block('widget_container_attributes') }}>
    {% for child in form %}
        {{ form_widget(child) }}
        {{ form_label(child) }}           {# There #}
    {% endfor %}
    </div>
{% endspaceless %}
{% endblock choice_widget_expanded %}

Upvotes: 3

Related Questions