How to hide form fields in twig template?

Question

I have a Symfony form that includes two TextType fields. If a certain check evaluates to false, I don't want to display the input fields but output the static content of the field and include the form fields as hidden fields instead. How can I do that?

Liz

Answer 1

you can use HiddenType, or hide field in template:

{{ form_start(form) }}
    {% if someValue == true %}
        {{ form_widget(form.fieldName) }}
    {% else %}
        {{ form_widget(form.fieldName, { 'attr': {'class': 'hidden-row'} }) }}
    {% endif %}
    {# other fields... #}
{{ form_end(form) }}

or you can use FormEvents like FormEvents::PRE_SET_DATA in FormType. (doc)

Inflict

I was hoping for some kind of switch in form_row but I suspect that this is not implemented in Symfony... – Liz

@GottliebNotschnabel in fact it is :), I updated my answer – Inflict

No, what I meant was not hiding it via CSS, but rendering it as an hidden field. But I saw that your second approach allows that. Great, thanks! – Liz

Answer 2

You can prevent any output for the form field by pretending, that it was already rendered:

{{ form_start(form) }}
    {% if someValue == true %}
        {% do form.fieldName.setRendered() %}
    {% endif %}
{{ form_end(form) }}

Piscina

That‘s nice to know. Thanks! – Liz

This is what I was looking for! Thanks – Feet

this is actually I want ;) – Dextrality

I have one problem; when I use this code and submit form data changed to null but I have data in the form – Dextrality

Yes, if you have a value for a field and want to keep it you need to use the other approach in this Question. This answer is supposed to remove all traces of the field in the HTML code, which also results in values not being set, when transmitting the form. – Piscina

Answer 3

If you use Symfony 4.4, you can set the `div style="display: none;" style:

{{ form_start(form) }}
  <div class="row">
    {% if app.user %}
    <div class="col-lg-12">
      <fieldset>
        Login by: {{ app.user.username }}
      </fieldset>
    </div>
    <div class="col-lg-12">
      <fieldset>
        Mail : {{ app.user.email }}
      </fieldset>
    </div>
    <div class="col-md-12 col-sm-12" style="display: none;">
      <fieldset>
        {{ form_widget(form.owner, { 'attr': {'class': '', value: 'null'}}) }}
      </fieldset>
    </div>
    {% else %}
    <div class="col-md-6 col-sm-12">
      <fieldset>
        {{ form_widget(form.owner, {'attr': {'class': ''}}) }}
      </fieldset>
    </div>
    {% endif %}
    <div class="col-lg-12">
      <fieldset>
        {{ form_widget(form.content, {'attr': {'class': ''}}) }}
      </fieldset>
    </div>
    <div class="col-lg-12">
      <fieldset>
        <button type="submit" class="main-button">New</button>
      </fieldset>
    </div>
  </div>
{{ form_end(form) }}

Bureaucratize

Please share more details. In your code, there's no condition to check for the other field. Keep in mind that a good explanation helps others to understand your answer – Promycelium