在我使用 VichUploaderBundle 和 FosUserBundle 的 Symfony 3 项目中,我创建了一个用户上传头像图像的表单:
namespace AppUserBundle\Form\Type;
use Symfony\Component\Form\AbstractType;
use Symfony\Component\Form\FormBuilderInterface;
use Symfony\Component\Form\Extension\Core\Type\TextType;
use AppUserBundle\Form\Type\PurifiedTextAreaType;
use AppUserBundle\Form\Type\ProfileImageType;
class UserProfileFormType extends AbstractType
{
public function buildForm(FormBuilderInterface $builder, array $options)
{
parent::buildForm($builder, $options);
$builder->add('user_image_file',ProfileImageType::class,array('required'=>false,'label'=>'profile.image'));
$builder->add('name',TextType::class,array('label'=>'profile.first_name','required' => false));
$builder->add('surname',TextType::class,array('label'=>'profile.surnname','required' => false));
$builder->remove('username');
$builder->add('username',TextType::class,['required' => false]);
$builder->add('email',TextType::class,['required' => false]);
$builder->add('description',PurifiedTextAreaType::class,['required' => false]);
$builder->remove('current_password');
}
public function getParent()
{
return 'FOS\UserBundle\Form\Type\ProfileFormType';
}
public function getBlockPrefix()
{
return 'app_user_profile';
}
// For Symfony 2.x
public function getName()
{
return $this->getBlockPrefix();
}
}
使用ProfileImageType
图像表示:
namespace AppUserBundle\Form\Type;
use Vich\UploaderBundle\Form\Type\VichImageType;
use Symfony\Component\Form\AbstractType;
use Symfony\Component\OptionsResolver\OptionsResolver;
class ProfileImageType extends AbstractType
{
/**
* @return string
*/
public function getExtendedType()
{
return VichImageType::class;
}
/**
*
* {@inheritDoc}
* @see \Symfony\Component\Form\AbstractType::configureOptions()
*/
public function configureOptions(OptionsResolver $resolver)
{
$resolver->setDefaults(['required'=>false,'allow_delete'=>true,'download_link' => true]);
}
}
表单由以下模板('app/FOSUserBundle/Profile/edit_content.html.twig')呈现:
{% trans_default_domain 'FOSUserBundle' %}
{% form_theme form 'bootstrap_3_layout.html.twig' 'VichUploaderBundle:Form:fields.html.twig' %}
{{ form_start(form, { 'action': path('fos_user_profile_edit') }) }}
<div class="col-xs-12">
{{ form_row(form.user_image_file) }}
</div>
<div class="col-xs-12 col-sm-6">
<div class="form-group">
{{ form_row(form.name) }}
</div>
</div>
<div class="col-xs-12 col-sm-6">
<div class="form-group">
{{ form_row(form.surname) }}
</div>
</div>
<div class="col-xs-12 col-sm-6">
<div class="form-group">
{{ form_row(form.username) }}
</div>
</div>
<div class="col-xs-12 col-sm-6">
<div class="form-group">
{{ form_row(form.email) }}
</div>
</div>
<div class="col-xs-12">
<div class="form-group">
{{ form_row(form.description) }}
</div>
</div>
<div class="col-xs-12">
<div class="form-group">
<input type="submit" class="btn btn-flat btn-primary" value="{{ 'profile.edit.submit'|trans }}" />
</div>
</div>
{{ form_end(form) }}
但是{{ form_row(form.user_image_file) }}
不会由文件上传输入元素呈现,而是呈现以下html:
<div id="fos_user_profile_form_user_image_file"></div>
您知道为什么会发生这种情况以及我将如何解决吗?