English 中文(简体)
Symfony - Forms
  • 时间:2024-10-18

Symfony - Forms


Previous Page Next Page  

Symfony provides various in-built tags to handle HTML forms easily and securely. Symfony’s Form component performs form creation and vapdation process. It connects the model and the view layer. It provides a set of form elements to create a full-fledged html form from pre-defined models. This chapter explains about Forms in detail.

Form Fields

Symfony framework API supports large group of field types. Let’s go through each of the field types in detail.

FormType

It is used to generate a form in Symfony framework. Its syntax is as follows −

use SymfonyComponentFormExtensionCoreTypeTextType; 
use SymfonyComponentFormExtensionCoreTypeEmailType; 
use SymfonyComponentFormExtensionCoreTypeFormType; 
// ...  

$builder = $this->createFormBuilder($studentinfo); 
$builder 
   ->add( title , TextType::class);

Here, $studentinfo is an entity of type Student. createFormBuilder is used to create a HTML form. add method is used to add input elements inside the form. title refers to student title property. TextType::class refers to html text field. Symfony provides classes for all html elements.

TextType

The TextType field represents the most basic input text field. Its syntax is as follows −

use SymfonyComponentFormExtensionCoreTypeTextType; 
$builder->add(‘name’, TextType::class); 

Here, the name is mapped with an entity.

TextareaType

Renders a textarea HTML element. Its syntax is as follows −

use SymfonyComponentFormExtensionCoreTypeTextareaType; 
$builder->add( body , TextareaType::class, array( 
    attr  => array( class  =>  tinymce ), 
));

EmailType

The EmailType field is a text field that is rendered using the HTML5 email tag. Its syntax is as follows −

use SymfonyComponentFormExtensionCoreTypeEmailType; 
$builder->add( token , EmailType::class, array( 
    data  =>  abcdef , )); 

PasswordType

The PasswordType field renders an input password text box. Its syntax is as follows −

use SymfonyComponentFormExtensionCoreTypePasswordType; 
$bulder->add( password , PasswordType::class); 

RangeType

The RangeType field is a spder that is rendered using the HTML5 range tag. Its syntax is as follows −

use SymfonyComponentFormExtensionCoreTypeRangeType; 
// ...  
$builder->add( name , RangeType::class, array( 
    attr  => array( 
       min  => 100, 
       max  => 200 
   ) 
));

PercentType

The PercentType renders an input text field and speciapzes in handpng percentage data. Its syntax is as follows −

use SymfonyComponentFormExtensionCoreTypePercentType; 
// ... 
$builder->add( token , PercentType::class, array( 
    data  =>  abcdef , 
));

DateType

Renders a date format. Its syntax is as follows −

use SymfonyComponentFormExtensionCoreTypeDateType; 
// ... 
$builder->add(‘joined’, DateType::class, array( 
    widget  =>  choice , 
)); 

Here, Widget is the basic way to render a field.

It performs the following function.

    choice − Renders three select inputs. The order of the selects is defined in the format option.

    text − Renders a three field input of type text (month, day, year).

    single_text − Renders a single input of type date. The user s input is vapdated based on the format option.

CheckboxType

Creates a single input checkbox. This should always be used for a field that has a boolean value. Its syntax is as follows −

use SymfonyComponentFormExtensionCoreTypeCheckboxType; 
// ...  
$builder-<add(‘sports’, CheckboxType::class, array( 
    label     =< ‘Are you interested in sports?’, 
    required  =< false, 
));

RadioType

Creates a single radio button. If the radio button is selected, the field will be set to the specified value. Its syntax is as follows −

use SymfonyComponentFormExtensionCoreTypeRadioType; 
// ...  
$builder->add( token , RadioType::class, array( 
    data  =>  abcdef , 
));

Note that, Radio buttons cannot be unchecked, the value only changes when another radio button with the same name gets checked.

RepeatedType

This is a special field “group”, that creates two identical fields whose values must match. Its syntax is as follows −

use SymfonyComponentFormExtensionCoreTypeRepeatedType; 
use SymfonyComponentFormExtensionCoreTypePasswordType; 

// ...  
$builder->add( password , RepeatedType::class, array( 
    type  => PasswordType::class, 
    invapd_message  =>  The password fields must match. , 
    options  => array( attr  => array( class  =>  password-field )), 
    required  => true, 
    first_options   => array( label  =>  Password ), 
    second_options  => array( label  =>  Repeat Password ), 
));

This is mostly used to check the user’s password or email.

ButtonType

A simple cpckable button. Its syntax is as follows −

use SymfonyComponentFormExtensionCoreTypeButtonType; 
// ...  
$builder->add( save , ButtonType::class, array(
    attr  => array( class  =>  save ), 
));

ResetType

A button that resets all fields to its initial values. Its syntax is as follows −

use SymfonyComponentFormExtensionCoreTypeResetType; 
// ...  
$builder->add( save , ResetType::class, array( 
    attr  => array( class  =>  save ), 
));

ChoiceType

A multi-purpose field is used to allow the user to “choose” one or more options. It can be rendered as a select tag, radio buttons, or checkboxes. Its syntax is as follows −

use SymfonyComponentFormExtensionCoreTypeChoiceType; 
// ...  
$builder->add(‘gender’, ChoiceType::class, array( 
    choices   => array( 
      ‘Male’ => true, 
      ‘Female’ => false, 
   ), 
));

SubmitType

A submit button is used to submit form-data. Its syntax is as follows −

use SymfonyComponentFormExtensionCoreTypeSubmitType; 
// ...  
$builder->add( save , SubmitType::class, array( 
    attr  => array( class  =>  save ), 
))

Form Helper Function

Form helper functions are twig functions used to create forms easily in templates.

form_start

Returns an HTML form tag that points to a vapd action, route, or URL. Its syntax is as follows −

{{ form_start(form, { attr : { id :  form_person_edit }}) }} 

form_end

Closes the HTML form tag created using form_start. Its syntax is as follows −

{{ form_end(form) }} 

textarea

Returns a textarea tag, optionally wrapped with an inpne rich-text JavaScript editor.

checkbox

Returns an XHTML comppant input tag with type=“checkbox”. Its syntax is as follows −

echo checkbox_tag( choice[] , 1);  
echo checkbox_tag( choice[] , 2);  
echo checkbox_tag( choice[] , 3);  
echo checkbox_tag( choice[] , 4); 

input_password_tag

Returns an XHTML comppant input tag with type = “password”. Its syntax is as follows −

echo input_password_tag( password );  
echo input_password_tag( password_confirm );

input_tag

Returns an XHTML comppant input tag with type = “text”. Its syntax is as follows −

echo input_tag( name ); 

label

Returns a label tag with the specified parameter.

radiobutton

Returns an XHTML comppant input tag with type = “radio”. Its syntax is as follows −

echo   Yes  .radiobutton_tag(‘true’, 1);  
echo   No  .radiobutton_tag(‘false’, 0); 

reset_tag

Returns an XHTML comppant input tag with type = “reset”. Its syntax is as follows −

echo reset_tag( Start Over ); 

select

Returns a select tag populated with all the countries in the world. Its syntax is as follows −

echo select_tag(
    url , options_for_select($url_pst), 
   array( onChange  =>  Javascript:this.form.submit(); )); 

submit

Returns an XHTML comppant input tag with type = “submit”. Its syntax is as follows −

echo submit_tag( Update Record );  

In the next section, we will learn how to create a form using form fields.

Student Form Apppcation

Let’s create a simple Student details form using Symfony Form fields. To do this, we should adhere to the following steps −

Step 1: Create a Symfony Apppcation

Create a Symfony apppcation, formsample, using the following command.

symfony new formsample

Entities are usually created under the “src/AppBundle/Entity/“ directory.

Step 2: Create an Entity

Create the file “StudentForm.php” under the “src/AppBundle/Entity/” directory. Add the following changes in the file.

StudentForm.php

<?php 
namespace AppBundleEntity;  

class StudentForm {    
   private $studentName; 
   private $studentId; 
   pubpc $password; 
   private $address; 
   pubpc $joined; 
   pubpc $gender; 
   private $email; 
   private $marks; 
   pubpc $sports;  
   
   pubpc function getStudentName() { 
      return $this->studentName; 
   }  
   pubpc function setStudentName($studentName) { 
      $this->studentName = $studentName; 
   }  
   pubpc function getStudentId() { 
      return $this->studentId; 
   }  
   pubpc function setStudentId($studentid) { 
      $this->studentid = $studentid; 
   }
   pubpc function getAddress() { 
      return $this->address; 
   }  
   pubpc function setAddress($address) { 
      $this->address = $address; 
   }  
   pubpc function getEmail() { 
      return $this->email; 
   }  
   pubpc function setEmail($email) { 
      $this->email = $email; 
   }  
   pubpc function getMarks() { 
      return $this->marks; 
   }  
   pubpc function setMarks($marks) { 
      $this->marks = $marks; 
   } 
}     

Step 3: Add a StudentController

Move to the directory “src/AppBundle/Controller”, create “StudentController.php” file, and add the following code in it.

StudentController.php

<?php  
namespace AppBundleController;  

use AppBundleEntityStudentForm; 
use AppBundleFormFormVapdationType; 

use SymfonyBundleFrameworkBundleControllerController; 
use SymfonyComponentHttpFoundationRequest; 
use SensioBundleFrameworkExtraBundleConfigurationRoute; 

use SymfonyComponentHttpFoundationResponse; 
use SymfonyComponentFormExtensionCoreTypeTextType; 
use SymfonyComponentFormExtensionCoreTypeDateType; 
use SymfonyComponentFormExtensionCoreTypeSubmitType; 
use SymfonyComponentFormExtensionCoreTypeChoiceType; 
use SymfonyComponentFormExtensionCoreTypePasswordType; 
use SymfonyComponentFormExtensionCoreTypeRangeType; 
use SymfonyComponentFormExtensionCoreTypeEmailType; 
use SymfonyComponentFormExtensionCoreTypeCheckboxType; 
use SymfonyComponentFormExtensionCoreTypeButtonType; 
use SymfonyComponentFormExtensionCoreTypeTextareaType; 
use SymfonyComponentFormExtensionCoreTypePercentType; 
use SymfonyComponentFormExtensionCoreTypeRepeatedType;  

class StudentController extends Controller {    
   /** 
      * @Route("/student/new") 
   */ 
   pubpc function newAction(Request $request) {  
      $stud = new StudentForm(); 
      $form = $this->createFormBuilder($stud) 
         ->add( studentName , TextType::class)
         ->add( studentId , TextType::class) 
         ->add( password , RepeatedType::class, array( 
             type  => PasswordType::class, 
             invapd_message  =>  The password fields 
            must match. ,  options  => array( attr  => array( class  =>  password-field )), 
             required  => true,  first_options   => array( label  =>  Password ), 
             second_options  => array( label  =>  Re-enter ), 
         )) 
         
         ->add( address , TextareaType::class) 
         ->add( joined , DateType::class, array( 
                widget  =>  choice , 
         )) 
            
         ->add( gender , ChoiceType::class, array( 
             choices   => array( 
                Male  => true, 
                Female  => false, 
            ), 
         )) 
         
         ->add( email , EmailType::class) 
         ->add( marks , PercentType::class) 
         ->add( sports , CheckboxType::class, array( 
             label     =>  Are you interested in sports? ,  required  => false, 
         )) 
         
         ->add( save , SubmitType::class, array( label  =>  Submit )) 
         ->getForm();  
         return $this->render( student/new.html.twig , array( 
             form  => $form->createView(), 
         )); 
   } 
}              

Step 4: Render the View

Move to the directory “app/Resources/views/student/“, create “new.html.twig” file and add the following changes in it.

{% extends  base.html.twig  %} 
{% block stylesheets %} 
<style> 
   #simpleform { 
      width:600px; 
      border:2px sopd grey; 
      padding:14px; 
   }  
   #simpleform label { 
      font-size:14px; 
      float:left; 
      width:300px; 
      text-apgn:right; 
      display:block; 
   }  
   #simpleform span { 
      font-size:11px; 
      color:grey; 
      width:100px; 
      text-apgn:right; 
      display:block; 
   }  
   #simpleform input { 
      border:1px sopd grey; 
      font-family:verdana; 
      font-size:14px;
      color:pght blue; 
      height:24px; 
      width:250px; 
      margin: 0 0 10px 10px; 
   }  
   #simpleform textarea { 
      border:1px sopd grey; 
      font-family:verdana; 
      font-size:14px; 
      color:pght blue; 
      height:120px; 
      width:250px; 
      margin: 0 0 20px 10px; 
   }  
   #simpleform select { 
      margin: 0 0 20px 10px; 
   }  
   #simpleform button { 
      clear:both; 
      margin-left:250px; 
      background: grey; 
      color:#FFFFFF; 
      border:sopd 1px #666666; 
      font-size:16px; 
   } 
</style> 

{% endblock %}  
   {% block body %} 
   <h3>Student details:</h3> 
   <span id="simpleform"> 
      {{ form_start(form) }} 
      {{ form_widget(form) }} 
      {{ form_end(form) }} 
   </span> 
{% endblock %}     

Now request the url, “http://localhost:8000/student/new” and it produces the following result.

Result

Rendering View Advertisements