Question

我使用表单字段 sonata_type_model_autocomplete ，我想要自定义显示。我想在图片中获得自动完成功能：

我是否正确理解，执行此操作的唯一方法是覆盖模板 SonataAdminBundle：Form / Type：sonata_type_model_autocomplete.html.twig 中的块 sonata_type_model_autocomplete_selection_format ？如何在documentation。接下来，我必须创建一个自定义控制器，它将为我提供必要的数据并填写路由选项。也许就像this。

没有一个简单的现成解决方案吗？

Answer 1

我找到了解决方案。

可以使用选项 to_string_callback ，因此不会给出单个记录字段和渲染模板。

class DemoAdmin extends Admin
{
    protected function configureFormFields(FormMapper $formMapper)
    {
        $templating = $this->templating;
        $formMapper
            ->add('movie', 'sonata_type_model_autocomplete', [
                'property' => 'title',
                'label' => 'Movie',
                'multiple' => false,
                'required' => false,
                'container_css_class' => 'select2-image',
                'to_string_callback' => function($entity, $property) use ($templating) {
                    return $templating->render(
                        'AcmeDemoBundle:Form/Type/sonata_type_model_autocomplete:movie.html.twig',
                        ['entity' => $entity]
                    );
                },
            ]);
    }
}

模板代码：

{% spaceless %}
    <div class="select2-image__autocomplete">
        <img
            src="{{ entity.webPath | apply_filter('autocomplete') }}"
            class="select2-image__image"
            alt="{{ entity.title }}"
        />
        <strong>{{ entity.title }}</strong>
        <div>{{ entity.announce }}</div>
    </div>
{% endspaceless %}

config.yml

avalanche_imagine:
    filters:
        autocomplete:
            type: thumbnail
            options: { size: [60, 60], mode: outbound }

SCSS

.select2-image {
  height: auto;
  .select2-choice {
    height: 72px; // height 60 + 12 padding
  }
  &__autocomplete {
    clear: both;
    height: 60px;
  }
  &__image {
    float: left;
    margin-right: 5px;
    width: 60px;
    height: 60px;
  }
}

结果

如何在Sonata自动完成

1 个答案: