使用 Symfony2 formbuilder 显示缩略图而不是 img 的名称

Posted 2023-02-16

【中文标题】使用 Symfony2 formbuilder 显示缩略图而不是 img 的名称

【英文标题】：Show the thumbnails instead of the name of img with Symfony2 formbuilder

【发布时间】：2017-06-18 08:48:54

【问题描述】：

我正在制作允许用户选择图片的表单。

Symfony2.8 with sonataMediaBundle/

$form = $this->createFormBuilder($form)
    ->add('media',EntityType::class,array(
            'expanded' => true,
            'class' => "Application\Sonata\MediaBundle\Entity\Media"
            ))
    ->add('save', SubmitType::class, array('label' => 'Create Post'))
    ->getForm();

在树枝上

form_widget(form.media)

但是它显示的单选按钮只有 img 的名称。

○AAA.jpg ○BBB.jpg ○CCC.jpg ○DDD.jpg（'○'是单选按钮）

这对用户来说不是好的设计。

我想在这里显示 imgs 的缩略图。

有什么好的方法吗？

【参考方案1】：

我能想象的最简单的方法是使用 javascript 实际检查单选按钮。

你的控制器：

//src/AppBundle/Controller/YourController.php

public function yourAction()

    $em = $this->getDoctrine()->getManager();

    $medias = $em->getRepository('AppBundle:Media')->findAll();

    $entity = new YourEntity();

    $form = $this->createForm(YourEntityType::class, $entity);

    if ($form->isSubmitted() && $form->isValid()) 
        //... your logic
    

    return $this->render('AppBundle::template.html.twig', array(
        'form' => $form->createView(),
        'medias' => $medias
    ));

然后在你的树枝文件中

% for media in medias %
    <img class="to-select" src=" media.pathToThumbnail " data-id=" media.id " />
% endfor %

 form_start(form) 
    <!-- assuming you are using bootstrap -->
    <div class="hidden"> form_widget(form.media) </div>
     form_widget(form.submit) 
 form_end(form) 

% block javascripts %
    <script>
        //assuming you use jquery
        $('.to-select').click(function () 
            var id = '#form_name_media_' + $(this).data('id');
            var media = $(id);

            if (media.is(':checked')) 
                media.prop('checked', false);
             else 
                media.prop('checked', true);
            
        );
    </script>
% endblock javascripts %

【讨论】：

jquery部分可能会改进

非常感谢，我现在仍在为此苦苦挣扎，您的想法to control select boxes with jquery 对我来说是最好的选择。