0

我想使用 filepond 使我的输入表单更漂亮，但它用一系列没有 name 属性的元素替换了我的文件小部件，因此后端没有显示任何内容。

这是我的 Symfony 表单类：

class UserProfileType extends AbstractType
{
    public function buildForm(FormBuilderInterface $builder, array $options)
    {        
        $builder
            ->add('firstName', TextType::class)
            ->add('lastName', TextType::class)

            etc... 

            // This is the widget I am concerned about for this question
            ->add('idFile', FileType::class, [
                'label' => 'File or Files',
                'required' => false,
                'mapped'   => false,
                'multiple' => false
         ])

            etc... 

        ->add('save', SubmitType::class, [
            'attr' => ['class' => 'save'],
        ]); 
    }
}

这是我在 twig 中创建文件小部件时的样子：

<div class="col-12">
    <label for="file-upload" class="mb-2">Photo I.D.</label>
                                                    <!-- so right here where I add the filepond class --> 
    {{ form_widget(form.idFile, { 'id': 'file-upload', 'attr': {'class':     'form-control filepond'} } ) }}
  </div>

这是我使用的文件池库，包含在我的 twig 文件的底部：

<!-- Load FilePond library -->
<script src="https://unpkg.com/filepond/dist/filepond.min.js"></script>
<!-- <script src="https://unpkg.com/jquery-filepond/filepond.jquery.js">     
</script> -->
<script src="https://unpkg.com/filepond-plugin-image-preview/dist/filepond-plugin-image-preview.js"></script>
<link href="https://unpkg.com/filepond/dist/filepond.css" rel="stylesheet">
<link href="https://unpkg.com/filepond-plugin-image-preview/dist/filepond-plugin-image-preview.css" rel="stylesheet">

因此，当 twig 文件加载时，filepond 接管并将我的小部件转换为一系列具有各种属性的元素。

没关系，我知道 filepond 这样做是为了修饰您的表单。但问题是在后端，什么都没有出现。

要添加的另一件事-filepond 创建的所有元素都没有“名称”属性，我不明白为什么。

因此，当我查看后端的文件 suplerglobal 时，我的 idFile 不存在。

再次确认，当我取出 filepond 类时，我的 idFile 显示在后端的文件 suplerglobal 中就好了。

这是树枝生成的输入元素：

<div class="col-12">
    <label for="file-upload" class="mb-2">Photo I.D.</label>
    <input type="file" id="file-upload" name="user_profile[idFile]" class="form-control filepond" /> 
  </div>

如果我做一个检查元素，在文件池生成的 div 中有一个< input type="hidden" name="user_profile[idFile]" value="">

这是后端的控制器代码：

public function saveProfileCompleteAction(Request $request)
{
    $user = $this->getUser();

    $form = $this->createForm(UserProfileType::class, $user);
    $form->handleRequest($request);

    if($form->isSubmitted() && $form->isValid())
    {
        $idFile = $form['idFile']->getData();

如果我这样做，dump($idFile);那么它只会显示 null，并且我已经检查并确保我选择了要上传的文件。

如何使用 filepond 库并让我的文件输入小部件显示在后端？

4

0 回答 0