I have a variety of choice fields in a form I'm creating, but all of them are loaded from PHP arrays that are defined in code. createForm() is given an empty model. Each field, when rendered with form_row() in twig tacks on about 2 seconds to render, each, making the request take about 8 or 9 seconds, which is ridiculous. I've tried searching, reading, etc. and from what I can tell I am following best practices. There are no database queries being run. Please help me nail down this huge performance problem.
Let's start with the form type:
class SubscriptionType extends AbstractType
{
public function buildForm(FormBuilderInterface $builder, array $options)
{
$builder
->add('latitude', 'hidden')
->add('longitude', 'hidden')
->add('crop', 'choice', [
'choices' => Crop::getFormChoices(),
'required' => true,
])
->add('infliction', 'choice', [
'choices' => Infliction::getFormChoices(),
'required' => true,
])
->add('emergenceDate', 'date')
->add('threshold', 'choice', [
'choices' => Threshold::getFormChoices(),
'label' => 'Severity threshold',
'required' => true,
])
->add('save', 'submit', ['label' => 'Subscribe']);
}
public function setDefaultOptions(OptionsResolverInterface $resolver)
{
$resolver->setDefaults([
'data_class' => 'PlantPath\Bundle\VDIFNBundle\Entity\Subscription',
]);
}
public function getName()
{
return 'subscription';
}
}
Then, in my controller:
public function formAction(Request $request)
{
$subscription = new Subscription();
$form = $this->createForm(new SubscriptionType(), $subscription);
$form->handleRequest($request);
if ($form->isSubmitted() && $form->isValid()) {
// ...
}
return $this->render('PlantPathVDIFNBundle:Subscription:form.html.twig', [
'form' => $form->createView(),
]);
}
Subscription/form.html.twig:
{{ form_start(form, {'attr': {'id': 'subscription-form'}}) }}
{{ form_row(form.crop) }}
{{ form_row(form.infliction) }}
{{ form_row(form.emergenceDate) }}
{{ form_row(form.threshold) }}
{{ form_end(form) }}
As I mentioned, each call to form_row() takes a good two seconds. If I take out all the form_row()s and the form_end(), the template is rendered (without a form) in milliseconds. I cannot fathom why Symfony needs over 8 seconds to render several lines of HTML for a blank form.
The blocks for rendering the choice fields in bootstrap_3_layout.html.twig contains '|trans' filter which tries to find translation for each option.
Override choice_widget_options block in your twig file, if you do not wish to translate. This should eliminate the warning messages caused due to translation.
Related
I've worked through a few of the Forms-Tutorials on the Symfony-Page (especially How to Embed a Collection of Forms, How To use a Form without a Dataclass & CollectionType Field ).
I'm trying to show a form with multiple lead partners which can be edited and submitted back to the system.
But i get a Twig_Runtime_Error saying: ''Variable "lead_partners" does not exist''.
My Twig:
{% block content %}
<div>
{{ form_start(form) }}
{% for partner in lead_partners %}
{{ form_row(partner.name) }}
{% endfor %}
{{ form_end(form) }}
</div>
{% endblock content %}
My Controller Code:
public function overview(Request $request, \App\Utility\LeadPartnerLoader $LeadPartnerLoader)
{
$leadPartnerList = $LeadPartnerLoader->loadAll();
$form = $this->createFormBuilder($leadPartnerList)
->add('lead_partners', CollectionType::class, [
'entry_type' => LeadPartnerFormType::class,
])->getForm();
$form->handleRequest($request);
if($form->isSubmitted() && $form->isValid())
{
$data = $form->getData();
}
return $this->render(
'lead_partner_overview2.html.twig',
[
'form' => $form->createView()
]);
}
And the Form Type (LeadPartnerFormType):
public function configureOptions(OptionsResolver $resolver)
{
$resolver->setDefaults(array(
'data_class' => LeadPartner::class,
));
}
public function buildForm(FormBuilderInterface $builder, array $options)
{
$builder
->add('id', HiddenType::class)
->add('name', TextType::class);
}
$leadPartnerList is of type array.
What am i doing wrong/missing here?
Kind Regards
It seems your action overview soesn't return the lead_partners variable you use in your template.
You can try to do this
return $this->render(
'lead_partner_overview2.html.twig',
[
'form' => $form->createView(),
'lead_partners' => $leadPartnerList, // I gess that's the list you want to loop ?
]);
I have been experiencing problems with embedding a controller that creates a form where you can upload files. When the controller is rendered in certain parts of the twig file, I get this error:
An exception has been thrown during the rendering of a template ("Expected argument of type "Symfony\Component\HttpFoundation\File\UploadedFile", "string" given").
This is strange since in other parts of the same twig file, the expected argument is given without problems. The problem seems to be another form in the same twig file that doesn't play nice with my embedded controller form.
The part that seems to cause the problem:
<div id="payment_checkout_form">
{% if cId and shippingRegionId %}
{% set savedPath =path('cart_set_shipping', {'store_id': webstore.id, 'shippingRegion': shippingRegionId,'cId':cId}) %}
{{ form_start(form, {'attr': {'id': 'form_checkout','data-url':savedPath}}) }}
{% else %}
{{ form_start(form, {'attr': {'id': 'form_checkout'}}) }}
{% endif %}
{{ render(url('passport')) }}
Relevent part of my PassportType:
public function buildForm(FormBuilderInterface $builder, array $options)
{
$builder
->add('file', 'file', array('label' => false) , [
'multiple' => true,
'label' => '',
'attr' => [
'accept' => 'image/*',
'multiple' => 'multiple'
]
]
)
->add('confirm', 'submit');
}
public function configureOptions(OptionsResolver $resolver){
$resolver->setDefaults(array(
'data_class' => 'AppBundle\Entity\Passport',
));
}
Relevent part of my Passport entity:
/**
* #Assert\File(maxSize="6000000")
*/
private $file;
/**
* Sets file.
*
* #param Symfony\Component\HttpFoundation\File\UploadedFile $file
*/
public function setFile(UploadedFile $file = null) {
$this->file = $file;
}
Relevent part of my Passport controller
/**
* #Route("/passport", name="passport")
*/
public function createPassportAction(Request $request)
{
$request = $this->get('request_stack')->getMasterRequest();
$passport = new Passport();
$passport->setName('default');
$form = $this->createForm(new PassportType(), $passport);
$form->handleRequest($request);
if ($form->isSubmitted() && $form->isValid()) {
$files = $request->files->get('passportPhoto');
if (!empty($files)) {
$this->uploadFile($files);
}
}
return $this->render('passport.html.twig', [
'form' => $form->createView(),
'isFormSubmitted' => $form->isSubmitted(),
'passportImages' => $this->getDoctrine()->getRepository('AppBundle\Entity\Passport')->findAll(),
]);
}
{{ render(url('passport')) }} is the embedded controller that renders the file upload form. If I put the{{ render(url('passport')) }} above the form_start of the other form everything works.
Answering my own question:
embedding a form inside another form like I'm trying to do in the question by using render is not possible. I fixed my problem by first removing the render call of my embedded passport form and making my passport type a sub type of the type that is used in the checkout form like this:
public function buildForm(FormBuilderInterface $builder, array $options){
$builder
...
->add('passport', new PassportType(), array(
'required' => true
))
...
}
I still wanted to have the controller of the passport part of my form to be in it's own file. To achieve this I called my passport controller inside of the checkout controller using the forward method like this:
$files = $request->files->get('order')['passport_id'];
$store_id = $request->attributes->get('store_id');
$this->forward('AppBundle\Controller\PassportController::uploadFile',
[ 'files' => $files, 'store_id' => $store_id ]);
I create a form and then when I click on submit button, show this error message:
Please select an item in the list.
How can I change this message and style it ( with CSS )?
Entity:
...
/**
* #ORM\Column(type="string", length=255)
* #Assert\NotBlank(message="Hi user, Please select an item")
*/
private $name;
...
Controller:
...
public function index(Request $request)
{
$form = $this->createForm(MagListType::class);
$form->handleRequest($request);
return $this->render('index.html.twig', [
'form' => $form->createView()
]);
}
...
Form:
...
public function buildForm(FormBuilderInterface $builder, array $options)
{
$builder
->add('name', EntityType::class,[
'class' => InsCompareList::class,
'label' => false,
'query_builder' => function(EntityRepository $rp){
return $rp->createQueryBuilder('u')
->orderBy('u.id', 'ASC');
},
'choice_label' => 'name',
'choice_value' => 'id',
'required' => true,
])
->add('submit', SubmitType::class, [
'label' => 'OK'
])
;
...
}
In order to use custom messages, you have to put 'novalidate' on your HTML form. For example:
With Twig:
{{ form_start(form, {attr: {novalidate: 'novalidate'}}) }}
{{ form_widget(form) }}
{{ form_end(form) }}
Or in your controller:
$form = $this->createForm(MagListType::class, $task, array( //where task is your entity instance
'attr' => array(
'novalidate' => 'novalidate'
)
));
This Stackoverflow answer has more info on how to use novalidate with Symfony. You can also check the docs for more info.
As for the styling, you can use JavaScript to trigger classes, which you can then style in your CSS, like in this example taken from Happier HTML5 Form Validation . You can also take a look at the documentation on MDN and play with the :valid and :invalid selectors.
const inputs = document.querySelectorAll("input, select, textarea");
inputs.forEach(input => {
input.addEventListener(
"invalid",
event => {
input.classList.add("error");
},
false
);
});
EDIT:
You are probably not seeing your custom message because it comes from server side, the message that you're currently seeing when submitting your form is client-side validation. So you can either place novalidate on your field, or you can override the validation messages on the client side by using setCustomValidity(), as described in this SO post which also contains many useful links. An example using your Form Builder:
$builder
->add('name', EntityType::class,[
'class' => InsCompareList::class,
'label' => false,
[
'attr' => [
'oninvalid' => "setCustomValidity('Hi user, Please select an item')"
]
],
'query_builder' => function(EntityRepository $rp){
return $rp->createQueryBuilder('u')
->orderBy('u.id', 'ASC');
},
'choice_label' => 'name',
'choice_value' => 'id',
'required' => true,
])
->add('submit', SubmitType::class, [
'label' => 'OK'
]);
I have 2 entities:
class Exercise
{
//entity
}
and
class Question
{
//entity
}
Their relationship is ManyToMany.
The question is: How I can filter (on the exercise form) the Question entities?
I have this form for Exercise:
public function buildForm(FormBuilderInterface $builder, array $options)
{
$builder
->add('questions', null, array(
'property' => 'name',
'multiple' => true,
'expanded' => false,
'query_builder' => function(EntityRepository $er) use ($options) {
return $er->createQueryBuilder('u')
->where('u.level = :level')
->setParameter('level',$options['level'])
->orderBy('u.dateR', 'ASC');},
))
//other fields
->add('Save','submit')
;
}
I know that I can filter with the query_builder but, how I can pass the var $search?
Should I create another form?
Any help would be appreciated.
Best regards
EDIT: I have found the solution that I want. I put 2 forms on the Controller Action, one form for the entity and one form for filter.
//ExerciseController.php
public function FormAction($level=null)
{
$request = $this->getRequest();
$exercise = new Exercise();
//Exercise form
$form = $this->createForm(new ExerciseType(), $exercise,array('level' => $level));
//create filter form
$filterForm = $this->createFormBuilder(null)
->add('level', 'choice', array('choices' => array('1' => '1','2' => '2','3' => '3')))
->add('filter','submit')
->getForm();
//Manage forms
if($request->getMethod() == 'POST'){
$form->bind($request);
$filterForm->bind($request);
//If exercise form is received, save it.
if ($form->isValid() && $form->get('Save')->isClicked()) {
$em = $this->getDoctrine()->getManager();
$em->persist($exercise);
$em->flush();
return $this->redirect($this->generateUrl('mybundle_exercise_id', array('id' => $exercise->getId())));
}
//If filter form is received, filter and call again the main form.
if ($filterForm->isValid()) {
$filterData = $formFiltro->getData();
$form = $this->createForm(new ExerciseType(), $exercise,array('level' => $filterData['level']));
return $this->render('MyBundle:Exercise:crear.html.twig', array(
'ejercicio' => $ejercicio,
'form' => $form->createView(),
'formFiltro' => $formFiltro->createView(),
));
}
}
return $this->render('juanluisromanCslmBundle:Ejercicio:form.html.twig', array(
'exercise' => $exercise,
'form' => $form->createView(),
'formFiltro' => $filterForm->createView(),
));
}
Templating the forms
On the form.html.twig
{{ form_start(filterForm) }}
{{ form_errors(filterForm) }}
{{ form_end(filterForm) }}
{{ form_start(form) }}
{{ form_errors(form) }}
{{ form_end(form) }}
It works for me and it is that i was looking for.
What you probably want to do here, is to make use of the form builder:
$search = [...]
$form = $this->createForm(new AbstractType(), $bindedEntityOrNull, array(
'search' => $search,
));
here you can provide any list of arguments to the builder method of your AbstractType.
public function buildForm(FormBuilderInterface $builder, array $options)
as you may have guessed at this point you may access the options array throu the $option variable.
As a side note remember to provide a fallback inside the default option array. In your AbstractType you can do something like this:
public function setDefaultOptions(OptionsResolverInterface $resolver)
{
$resolver->setDefaults(array(
'search' => 'some_valid_default_value_if_search_is_not_provided'
));
}
hope it helps, regards.
For example I would like to use ChoiceType in Twig by passing choices, selected value and options.
Something like..
{{ render_select(choices, selected) }}
or
{{ render_choices(choices, selected, {'expanded': true, 'multiple': true}) }}
You shouldn't do it in Twig. The best practice is to creare a Form Class (Type) and define there this type of behaviour.
Example:
class TaskType extends AbstractType
{
public function buildForm(FormBuilderInterface $builder, array $options)
{
$builder
->add('task')
->add('dueDate', null, array('widget' => 'single_text'))
->add('active', 'choiche', array(
'choices' => array('0' => 'Deactive', '1' => 'Active'),
'required' => true,
)
)
->add('save', 'submit');
}
public function getName()
{
return 'task';
}
}
More info in the Symfony2 Docs
If you want to do it anyway, you should do it like this:
{{ form(form.formField, {'expanded': true, 'multiple': true, 'choices': {'0': 'Zero', '1': 'One'}}) }}
As you can see, it's really not easy...