使用 FormBuilderInterface 输入 Silex 文件

Question

在非常新鲜的订阅之后，我决定在这里寻求帮助，过去我在这里找到了很多解决问题的方法。

我刚刚完成了关于 Openclassrooms 的课程（发展为专业 PHP 架构），提供了开始使用 Silex、Twig 和 Bootstrap 的关键，并且在制作网站时正在阅读 Silex 的文档。

但在所有这些开发中，我决定使用 FormBuilderInterface 并将文件输入添加到我的表单中：

class ActivityType extends AbstractType
{
    public function buildForm(FormBuilderInterface $builder, array $options)
    {
        $builder
            ->add('title', 'text')
            ->add('public', 'choice', array(
                'choices' => array(
                    'children' => 'children',
                    'adults' => 'adults',
                    'family' => 'family',
                    ),
                ))
            ->add('withHorses', 'choice', array(
                'expanded' => 'true',
                'label' => 'With horses',
                ))
            ->add('content', 'textarea')
            ->add('image', 'file', array(
                'required' => 'false',
                'data_class' => null,
                ));
    }

    public function getName()
    {
        return 'activity';
    }
}

data_class => null 是为了避免异常。

这是视图：

{{ form_start(activityForm, { 'attr': {'class': 'form-horizontal'} }) }}
    <div class="form-group">
        {{ form_label(activityForm.title, null, { 'label_attr':  {
            'class': 'col-sm-4 control-label'
        }}) }}
        <div class="col-sm-6">
            {{ form_errors(activityForm.title) }}
            {{ form_widget(activityForm.title, { 'attr':  {
                'class': 'form-control'
            }}) }}
        </div>
    </div>
    <div class="form-group">
        {{ form_label(activityForm.public, null, { 'label_attr':  {
            'class': 'col-sm-4 control-label'
        }}) }}
        <div class="col-sm-6">
            {{ form_errors(activityForm.public) }}
            {{ form_widget(activityForm.public, { 'attr':  {
                'class': 'form-control'
            }}) }}
        </div>
    </div>
    <div class="form-group">
        {{ form_label(activityForm.withHorses, null, { 'label_attr':  {
            'class': 'col-sm-4 control-label'
        }}) }}
        <div class="col-sm-6">
            {{ form_errors(activityForm.withHorses) }}
            {{ form_widget(activityForm.withHorses, { 'attr':  {
                'class': 'form-control'
            }}) }}
        </div>
    </div>
    <div class="form-group">
        {{ form_label(activityForm.content, null, { 'label_attr':  {
            'class': 'col-sm-4 control-label'
        }}) }}
        <div class="col-sm-6">
            {{ form_errors(activityForm.content) }}
            {{ form_widget(activityForm.content, { 'attr':  {
                'class': 'form-control',
                'rows': '8'
            }}) }}
        </div>
    </div>
    <div class="form-group">
        {{ form_label(activityForm.image, null, { 'label_attr':  {
            'class': 'col-sm-4 control-label'
        }}) }}
        <div class="col-sm-6">
            {{ form_errors(activityForm.image) }}
            {{ form_widget(activityForm.image, { 'attr':  {
                'class': 'form-control',
                'accept': 'image/*'
            }}) }}
        </div>
    </div>
    <div class="form-group">
        <div class="col-sm-offset-4 col-sm-3">
            <input type="submit" class="btn btn-primary" value="Save" />
        </div>
    </div>
{{ form_end(activityForm) }}

显示文件输入，但 here 是它看起来的样子。

在检查 DOM 时，我看到了一些奇怪的东西 here。包含文件输入的 div 不具有 class "form-group" 并且我还认为未采用从视图添加到输入的属性（class: form-control 并接受：图像/*）考虑中。

我在文档上花了几个小时，并做了一些 Google 研究，但没有结果。我承认我在完全理解 Silex 方面遇到了一些困难，我对这种情况感到困惑。我希望这个文件输入通常位于文本区域和提交按钮之间，标签和文件输入也水平对齐，并且表单的这一部分考虑了视图中的代码（类和属性）。

此外，如果有人有关于 data_class 的信息，我会非常感兴趣（特别是为什么它必须为 null 以避免在使用该接口时文件输入出现异常）。

提前致谢！

Answer 1

如果我是你，我会使用 BraincraftedBootstrap：https://mrgierer.wordpress.com/2014/02/16/bootstrap-themed-forms-with-silex/

它可以完成您正在做的所有事情，但它确实有效:)

Answer 2

没关系！

虫子在椅子和桌子后面！我给你看的表格从一开始就是正确的，我只是弄错了文件，看错了文件。哦，对于那些想要重用我的代码的人：要小心，因为 withHorses 应该是一个复选框。

所以你需要改变:

add('withHorses', 'choice', array( 'expanded' => 'true', 'label' => 'With horses', ))

变成：

add('withHorses', 'checkbox', array( 'label' => 'With horses', ))

info here

Thegeekrv，通过 FormBuilderInterface，我获得了 bootstrap 风格的漂亮视图，所以我认为我真的不需要 BraincraftedBootstrap。但是，文件输入的样式不太好，所以我选择使用 bootstrap-filestyle. This is what it looks like, here.

非常感谢您的帮助和更正！

使用 FormBuilderInterface 输入 Silex 文件

Silex file input with FormBuilderInterface

php

symfony-forms

symfony

twig

silex