发布于 2015-08-27 16:53:32 | 155 次阅读 | 评论: 0 | 来源: 网络整理
Custom form field types are great when you need field types with a specific purpose, such as a gender selector, or a VAT number input.
But sometimes, you don’t really need to add new field types - you want to add features on top of existing types. This is where form type extensions come in.
Form type extensions have 2 main use-cases:
In both those cases, it might be possible to achieve your goal with custom form rendering, or custom form field types. But using form type extensions can be cleaner (by limiting the amount of business logic in templates) and more flexible (you can add several type extensions to a single form type).
Form type extensions can achieve most of what custom field types can do, but instead of being field types of their own, they plug into existing types.
Imagine that you manage a Media entity, and that each media is associated
to a file. Your Media form uses a file type, but when editing the entity,
you would like to see its image automatically rendered next to the file
input.
You could of course do this by customizing how this field is rendered in a template. But field type extensions allow you to do this in a nice DRY fashion.
Your first task will be to create the form type extension class (called ImageTypeExtension
in this article). By standard, form extensions usually live in the FormExtension
directory of one of your bundles.
When creating a form type extension, you can either implement the
FormTypeExtensionInterface interface
or extend the AbstractTypeExtension
class. In most cases, it’s easier to extend the abstract class:
// src/Acme/DemoBundle/Form/Extension/ImageTypeExtension.php
namespace AcmeDemoBundleFormExtension;
use SymfonyComponentFormAbstractTypeExtension;
class ImageTypeExtension extends AbstractTypeExtension
{
/**
* Returns the name of the type being extended.
*
* @return string The name of the type being extended
*/
public function getExtendedType()
{
return 'file';
}
}
The only method you must implement is the getExtendedType function.
It is used to indicate the name of the form type that will be extended
by your extension.
小技巧
The value you return in the getExtendedType method corresponds
to the value returned by the getName method in the form type class
you wish to extend.
In addition to the getExtendedType function, you will probably want
to override one of the following methods:
buildForm()buildView()configureOptions()finishView()For more information on what those methods do, you can refer to the Creating Custom Field Types cookbook article.
The next step is to make Symfony aware of your extension. All you
need to do is to declare it as a service by using the form.type_extension
tag:
services:
acme_demo_bundle.image_type_extension:
class: AcmeDemoBundleFormExtensionImageTypeExtension
tags:
- { name: form.type_extension, alias: file }
<service id="acme_demo_bundle.image_type_extension"
class="AcmeDemoBundleFormExtensionImageTypeExtension"
>
<tag name="form.type_extension" alias="file" />
</service>
$container
->register(
'acme_demo_bundle.image_type_extension',
'AcmeDemoBundleFormExtensionImageTypeExtension'
)
->addTag('form.type_extension', array('alias' => 'file'));
The alias key of the tag is the type of field that this extension should
be applied to. In your case, as you want to extend the file field type,
you will use file as an alias.
The goal of your extension is to display nice images next to file inputs (when the underlying model contains images). For that purpose, suppose that you use an approach similar to the one described in How to handle File Uploads with Doctrine: you have a Media model with a file property (corresponding to the file field in the form) and a path property (corresponding to the image path in the database):
// src/Acme/DemoBundle/Entity/Media.php
namespace AcmeDemoBundleEntity;
use SymfonyComponentValidatorConstraints as Assert;
class Media
{
// ...
/**
* @var string The path - typically stored in the database
*/
private $path;
/**
* @var SymfonyComponentHttpFoundationFileUploadedFile
* @AssertFile(maxSize="2M")
*/
public $file;
// ...
/**
* Get the image URL
*
* @return null|string
*/
public function getWebPath()
{
// ... $webPath being the full image URL, to be used in templates
return $webPath;
}
}
Your form type extension class will need to do two things in order to extend
the file form type:
configureOptions method in order to add an image_path
option;buildForm and buildView methods in order to pass the image
URL to the view.The logic is the following: when adding a form field of type file,
you will be able to specify a new option: image_path. This option will
tell the file field how to get the actual image URL in order to display
it in the view:
// src/Acme/DemoBundle/Form/Extension/ImageTypeExtension.php
namespace AcmeDemoBundleFormExtension;
use SymfonyComponentFormAbstractTypeExtension;
use SymfonyComponentFormFormView;
use SymfonyComponentFormFormInterface;
use SymfonyComponentPropertyAccessPropertyAccess;
use SymfonyComponentOptionsResolverOptionsResolverInterface;
class ImageTypeExtension extends AbstractTypeExtension
{
/**
* Returns the name of the type being extended.
*
* @return string The name of the type being extended
*/
public function getExtendedType()
{
return 'file';
}
/**
* Add the image_path option
*
* @param OptionsResolver $resolver
*/
public function configureOptions(OptionsResolver $resolver)
{
$resolver->setDefined(array('image_path'));
}
/**
* Pass the image URL to the view
*
* @param FormView $view
* @param FormInterface $form
* @param array $options
*/
public function buildView(FormView $view, FormInterface $form, array $options)
{
if (array_key_exists('image_path', $options)) {
$parentData = $form->getParent()->getData();
if (null !== $parentData) {
$accessor = PropertyAccess::createPropertyAccessor();
$imageUrl = $accessor->getValue($parentData, $options['image_path']);
} else {
$imageUrl = null;
}
// set an "image_url" variable that will be available when rendering this field
$view->vars['image_url'] = $imageUrl;
}
}
}
Each field type is rendered by a template fragment. Those template fragments can be overridden in order to customize form rendering. For more information, you can refer to the What are Form Themes? article.
In your extension class, you have added a new variable (image_url), but
you still need to take advantage of this new variable in your templates.
Specifically, you need to override the file_widget block:
{# src/Acme/DemoBundle/Resources/views/Form/fields.html.twig #}
{% extends 'form_div_layout.html.twig' %}
{% block file_widget %}
{% spaceless %}
{{ block('form_widget') }}
{% if image_url is not null %}
<img src="{{ asset(image_url) }}"/>
{% endif %}
{% endspaceless %}
{% endblock %}
<!-- src/Acme/DemoBundle/Resources/views/Form/file_widget.html.php -->
<?php echo $view['form']->widget($form) ?>
<?php if (null !== $image_url): ?>
<img src="<?php echo $view['assets']->getUrl($image_url) ?>"/>
<?php endif ?>
注解
You will need to change your config file or explicitly specify how you want your form to be themed in order for Symfony to use your overridden block. See What are Form Themes? for more information.
From now on, when adding a field of type file in your form, you can
specify an image_path option that will be used to display an image
next to the file field. For example:
// src/Acme/DemoBundle/Form/Type/MediaType.php
namespace AcmeDemoBundleFormType;
use SymfonyComponentFormAbstractType;
use SymfonyComponentFormFormBuilderInterface;
class MediaType extends AbstractType
{
public function buildForm(FormBuilderInterface $builder, array $options)
{
$builder
->add('name', 'text')
->add('file', 'file', array('image_path' => 'webPath'));
}
public function getName()
{
return 'media';
}
}
When displaying the form, if the underlying model has already been associated with an image, you will see it displayed next to the file input.