In my Symfony 2 app I got the following code rendering the form:
{{ form_start(form) }}
{{ form_errors(form) }}
<div class="form-group">
{{ form_label(form.title) }}
{{ form_widget(form.title) }}
</div>
<div class="form-group">
{{ form_label(form.message) }}
{{ form_widget(form.message) }}
</div>
{% if extras == true %} //this block should be rendered only if extras var is true
<div class="form-group">
{{ form_label(form.description) }}
{{ form_widget(form.description) }}
</div>
{% endif %}
{{ form_end(form) }}
The problem is that I get rendered {{ form_widget(form.description) }} even if my extras var is false, not with all other form fields but somewhere at the bottom of the form which is obviously a bug. How to make it render only if extras is true and disappear completely from the page in case extras is false?
Thank you.
All other form fields are automatically added to the end of your form by default. It triggers {{ form_rest() }} by default. Use this code to prevent this behavior:
{{ form_end(form, {'render_rest': false}) }}
http://symfony.com/doc/current/reference/forms/twig_reference.html#form-end-view-variables
Related
I overrided my form in EasyAdmin to organize differently my input so I did like this :
In my Crud :
public function configureCrud(Crud $crud): Crud
{
return $crud
->setPageTitle(Crud::PAGE_INDEX, 'admin.menu.infos')
->setFormThemes(['bundles/EasyAdminBundle/crud/company/edit.html.twig'])
;
}
And in my Twig :
{% extends '#EasyAdmin/crud/form_theme.html.twig' %}
{% use '#EasyAdmin/symfony-form-themes/bootstrap_5_layout.html.twig' %}
{% block form %}
{{ form_start(form) }}
<div class="row">
{{ form_row(form.logo) }}
{{ form_row(form.phone) }}
{{ form_row(form.catchphrase) }}
</div>
<div class="row">
{{ form_row(form.businessName) }}
{{ form_row(form.email) }}
{{ form_row(form.website) }}
</div>
<div class="row">
{{ form_row(form.companyName) }}
{{ form_row(form.address) }}
{{ form_row(form.linkedin) }}
</div>
<div class="row">
{{ form_row(form.siren) }}
{{ form_row(form.zipcode) }}
{{ form_row(form.facebook) }}
</div>
<div class="row">
{{ form_row(form.legalForm) }}
{{ form_row(form.city) }}
{{ form_row(form.twitter) }}
</div>
<div class="row">
{{ form_row(form.description) }}
</div>
{{ form_end(form) }}
{% endblock %}
The form is like I wanted and when I submit, it's work but the problem is when I make an error. For example if I valid with an empty value, then instead of getting my form_errors, I've got a 500.
I've tried different things but none of them worked :
block errors :
{{ form_start(form) }}
{% block form_errors %}
{{ parent() }}
{% endblock %}
individual error :
{{ form_errors(form.businessName) }}
Any idea ?
I'm using symfony 2.8. In registration form, when I submit form with empty fields, it is showing validation errors in tag. It is really making the UI looks bad. How can I change the css of each validation error messages.
{{ form_start(form, {'method': 'post', 'action': path('fos_user_registration_register'), 'attr': {'class': 'fos_user_registration_register','novalidate': 'novalidate'}}) }}
<div class="form-group">
{{ form_row(form.name) }}
</div>
<div class="form-group">
{{ form_row(form.email) }}
</div>
<div class="form-group">
{{ form_row(form.username) }}
</div>
<div class="form-group">
{{ form_row(form.plainPassword.first) }}
</div>
<div class="form-group">
{{ form_row(form.plainPassword.second) }}
</div>
<div>
<input type="submit" class="btn btn-primary" value="{{ 'registration.submit'|trans }}" />
</div>
{{ form_end(form) }}
You are rendering form fields using form_row widget which renders label, field & related error to do custom styling you can render your fields and their labels and errors individually like
{{ form_start(form, {'method': 'post', 'action': path('fos_user_registration_register'), 'attr': {'class': 'fos_user_registration_register','novalidate': 'novalidate'}}) }}
{{ form_label(form.email) }}
<div class="some_class">{{ form_errors(form.email) }} </div>
{{ form_widget(form.email) }}
{{ form_end(form) }}
<style type="text/css">
.some_class{
/* write custom styling rules here */
}
</style>
Or get all errors in one place like
{# render any "global" errors #}
{{ form_errors(form) }}
Reference: Twig Template Form Function and Variable Reference
The errors have their own element and classes that you could target from your css.
One basic approach could by using a form theme as described here, or you could create your own form theme.
If you want to customise the tags it renders you could do what this guy does here.
I have below problem with FOSUserBundle customization.
I was overwritten FOSUser register form, then I changed register_content from
{{ form_widget(form) }}
to:
<div class="col-md-6">
{{ form_label(form.firstname) }}
{{ form_errors(form.firstname) }}
{{ form_widget(form.firstname) }}
{{ form_label(form.lastname) }}
{{ form_errors(form.lastname) }}
{{ form_widget(form.lastname) }}
</div>
<div class="col-md-6">
{{ form_label(form.email) }}
{{ form_errors(form.email) }}
{{ form_widget(form.email) }}
{{ form_label(form.plainPassword) }}
{{ form_errors(form.plainPassword) }}
{{ form_widget(form.plainPassword) }}
{{ form_label(form.plainPassword.second) }}
{{ form_errors(form.plainPassword.second) }}
{{ form_widget(form.plainPassword.second) }}
</div>
But, when I was went to the browser, I got it:
bad form render
The form renders incorrectly. How I can repair this?
try with this
{{ form_label(form.plainPassword.first) }}
{{ form_errors(form.plainPassword.first) }}
{{ form_widget(form.plainPassword.first) }}
{{ form_label(form.plainPassword.second) }}
{{ form_errors(form.plainPassword.second) }}
{{ form_widget(form.plainPassword.second) }}
I'm trying to control the rendering of password fields based on whether i'm editing an user or creating one. I'm doing this with a simple session boolean variable as follows:
{{ form_start(userForm) }}
{{ form_errors(userForm) }}
<div id="user-fg-email" class="form-group">
{{ form_label(userForm.email) }}
{{ form_errors(userForm.email) }}
{{ form_widget(userForm.email) }}
</div>
{% if app.session.get('editingUser') == false %}
<div id="user-fg-pp1" class="form-group">
{{ form_label(userForm.plainPassword.first) }}
{{ form_widget(userForm.plainPassword.first) }}
</div>
<div id="user-fg-pp2" class="form-group">
{{ form_label(userForm.plainPassword.second) }}
{{ form_errors(userForm.plainPassword.first) }}
{{ form_widget(userForm.plainPassword.second) }}
</div>
{% endif %}
<div id="user-fg-role" class="form-group">
{{ form_label(userForm.role) }}
{{ form_errors(userForm.role) }}
{{ form_widget(userForm.role) }}
</div>
<button type="submit" class="btn btn-primary pull-right">Submit</button>
{{ form_end(userForm) }}
However when this boolean is evaluated as true, which is supposed to prevent these fields from rendering, they are still being rendered assumingly by the later following form_end tag.
Is there a way to prevent that from happening?
edit:
if editingUser == true the password fields are actually rendered after the button, hence my assumption it's done so by the form_end tag.
Because you have to specify Twig to not display all the rest of the fields which are not explicitly rendered in the form : http://symfony.com/doc/current/reference/forms/twig_reference.html#form-end-view-variables
{{ form_end(form, {'render_rest': false}) }}
I'm creating a form in Symfony2 that contains more than one submit button. I need to control where these buttons are rendered. I tried the following, but naturally nothing happens.
<h1>Search Form</h1>
<div id="search_form">
{{ form(formSearch) }}
</div>
<div id="search_tasks">
Tasks:
{{ form_widget(formSearch.searchButton1) }}
{{ form_widget(formSearch.searchButton2) }}
</div>
The search buttons are declared in the form class; they are rendered inside #search_form and nothing shows up in #search_tasks.
You are already rendering the whole form with {{ form(formSearch) }} (fields and buttons are only rendered once).
You need to render the start, rows and end separately.
{{ form_start(formSearch) }}
<h1>Search Form</h1>
<div id="search_form">
{{ form_row(formSearch.field1) }}
{{ form_row(formSearch.field2) }}
{{ form_row(formSearch.field3) }}
</div>
<div id="search_tasks">
Tasks:
{{ form_widget(formSearch.searchButton1) }}
{{ form_widget(formSearch.searchButton2) }}
</div>
{{ form_end(formSearch) }}
I ran into the same issue where I needed my Submit and Reset buttons to be on the same row. My forms are dynamic so there was no way I could output the fields individually. I captured the buttons' HTML first so that form_widget(form) wouldn't output them for me.
{% form_theme form 'AppBundle::form/form_layout.html.twig' %}
<div class="row">
{{ form_start(form) }}
{% if form.submit is defined %}
{% set submitButton = form_widget(form.submit) %}
{% endif %}
{% if form.reset is defined %}
{% set resetButton = form_widget(form.reset) %}
{% endif %}
{{ form_widget(form) }}
<div class="form-group row">
{% if submitButton is defined %}
{{ submitButton|raw }}
{% endif %}
{% if resetButton is defined %}
{{ resetButton|raw }}
{% endif %}
</div>
{{ form_end(form) }}
</div>