How to implement forms with Symfony Form component

Details



In all web applications, user input is handled by HTML Forms. Symfony has the form component to make easy and fast form implementation and handling. Here is a basic form layout that you may use to implement your own forms:

 

Basic Form Creation:
Let's say you want to create a simple contact form with a name, email, and message field.

// src/Form/ContactFormType.php
namespace App\Form;

use Symfony\Component\Form\AbstractType;
use Symfony\Component\Form\Extension\Core\Type\EmailType;
use Symfony\Component\Form\Extension\Core\Type\TextType;
use Symfony\Component\Form\Extension\Core\Type\TextareaType;
use Symfony\Component\Form\FormBuilderInterface;
use Symfony\Component\OptionsResolver\OptionsResolver;

class ContactFormType extends AbstractType
{
    public function buildForm(FormBuilderInterface $builder, array $options)
    {
        $builder
            ->add('name', TextType::class, ['label' => 'Name'])
            ->add('email', EmailType::class, ['label' => 'Email'])
            ->add('message', TextareaType::class, ['label' => 'Message']);
    }

    public function configureOptions(OptionsResolver $resolver)
    {
        $resolver->setDefaults([
            // Configure the data class to store the form data (optional)
            'data_class' => 'App\Entity\Contact', // Replace with your entity class if using one
        ]);
    }
}

 

Using the Form in a Controller:
Now, you can use this form in a controller to handle form submission and processing.

// src/Controller/ContactController.php
namespace App\Controller;

use App\Form\ContactFormType;
use Symfony\Bundle\FrameworkBundle\Controller\AbstractController;
use Symfony\Component\HttpFoundation\Request;
use Symfony\Component\HttpFoundation\Response;
use Symfony\Component\Routing\Annotation\Route;

class ContactController extends AbstractController
{
    /**
     * @Route("/contact", name="contact")
     */
    public function contactForm(Request $request): Response
    {
        // Create a new instance of your data class to store the form data (optional)
        $contact = new \App\Entity\Contact(); // Replace with your entity class if using one

        // Create the form
        $form = $this->createForm(ContactFormType::class, $contact);

        // Handle form submission
        $form->handleRequest($request);
        if ($form->isSubmitted() && $form->isValid()) {
            // Process the form data, e.g., sending an email or saving to the database

            // Redirect to a success page or display a success message
            return $this->redirectToRoute('success_page');
        }

        return $this->render('contact/contact_form.html.twig', [
            'form' => $form->createView(),
        ]);
    }
}

 

Rendering the Form in a Twig Template:
Finally, render the form in a Twig template.

{# templates/contact/contact_form.html.twig #}
{% extends 'base.html.twig' %}

{% block content %}
    <h1>Contact Form</h1>
    {{ form_start(form) }}
    {{ form_row(form.name) }}
    {{ form_row(form.email) }}
    {{ form_row(form.message) }}
    <button type="submit">Submit</button>
    {{ form_end(form) }}
{% endblock %}

 

The Form Component provides many options and features to handle form rendering, validation, and data processing, making it a powerful tool for managing form data in Symfony applications.

For more examples on Symfony forms implementation: