Search code examples
symfonytwigvichuploaderbundle

Symfony vichimage upload make two labels in formbuilder


Hi guys fro some reason the form builder make me two labels when i specified my own label.

Here is the config for the vich image bundle:

vich_uploader:
    db_driver: orm
    mappings:
        product_image:
            uri_prefix:         /images/products
            upload_destination: %kernel.root_dir%/../web/images/products
            inject_on_load:     false
            delete_on_update:   true
            delete_on_remove:   true
        apartment_image:
            uri_prefix:         /images/apartment
            upload_destination: %kernel.root_dir%/../web/images/apartment
            inject_on_load:     false
            delete_on_update:   true
            delete_on_remove:   true
        slide_image:
            uri_prefix:         /images/slider
            upload_destination: %kernel.root_dir%/../web/images/slider
            inject_on_load:     false
            delete_on_update:   true
            delete_on_remove:   true
        point_image:
            uri_prefix:         /images/point
            upload_destination: %kernel.root_dir%/../web/images/point
            inject_on_load:     false
            delete_on_update:   true
            delete_on_remove:   true
        object_image:
            uri_prefix:         /images/object
            upload_destination: %kernel.root_dir%/../web/images/object
            inject_on_load:     false
            delete_on_update:   true
            delete_on_remove:   true
        gallery_image:
            uri_prefix:         /images/gallery
            upload_destination: %kernel.root_dir%/../web/images/gallery
            inject_on_load:     false
            delete_on_update:   true
            delete_on_remove:   true

Here is the buildForm:

public function buildForm(FormBuilderInterface $builder, array $options)
{
    $builder
        ->add('translations', 'a2lix_translations',array(
            'required_locales' => array('bg','en')
        ))
        ->add('canvas')
        ->add('mode','checkbox', array('label'=> 'In sell','required'=>false))
        ->add('lat','text',array('label'=>'Latitude'))
        ->add('longt','text',array('label'=>'Longitude '))
        ->add('imageLeadFile', 'vich_image', array(
            'label'=>'Lead image Home Page (720x534)',
            'required' => false,
            'allow_delete' => true, // not mandatory, default is true
            'download_link' => true, // not mandatory, default is true
        ))
        ->add('imageLocationFile', 'vich_image', array(
            'required' => false,
            'allow_delete' => true, // not mandatory, default is true
            'download_link' => true, // not mandatory, default is true
        ))
        ->add('imagePinFile', 'vich_image', array(
            'required' => false,
            'allow_delete' => true, // not mandatory, default is true
            'download_link' => true, // not mandatory, default is true
        ))
        ->add('imageAligmentFile', 'vich_image', array(
            'required' => false,
            'allow_delete' => true, // not mandatory, default is true
            'download_link' => true, // not mandatory, default is true
        ))
        ->add('imageAligmentIconFile', 'vich_image', array(
            'required' => false,
            'allow_delete' => true, // not mandatory, default is true
            'download_link' => true, // not mandatory, default is true
        ))
        ->add('imageArchitectureIconFile', 'vich_image', array(
            'required' => false,
            'allow_delete' => true, // not mandatory, default is true
            'download_link' => true, // not mandatory, default is true
        ))->add('imageStageIconFile', 'vich_image', array(
            'required' => false,
            'allow_delete' => true, // not mandatory, default is true
            'download_link' => true, // not mandatory, default is true
        ))->add('imageLocationIconFile', 'vich_image', array(
            'required' => false,
            'allow_delete' => true, // not mandatory, default is true
            'download_link' => true, // not mandatory, default is true
        ))->add('imageGalleryIconFile', 'vich_image', array(
            'required' => false,
            'allow_delete' => true, // not mandatory, default is true
            'download_link' => true, // not mandatory, default is true
        ))->add('imageColumFirstFile', 'vich_image', array(
        'required' => false,
        'allow_delete' => true, // not mandatory, default is true
        'download_link' => true, // not mandatory, default is true
        ))->add('imageColumSecondFile', 'vich_image', array(
        'required' => false,
        'allow_delete' => true, // not mandatory, default is true
        'download_link' => true, // not mandatory, default is true
    ))->add('imageColumThirdFile', 'vich_image', array(
            'required' => false,
            'allow_delete' => true, // not mandatory, default is true
            'download_link' => true, // not mandatory, default is true
    ))->add('imageColumForthFile', 'vich_image', array(
            'required' => false,
            'allow_delete' => true, // not mandatory, default is true
            'download_link' => true, // not mandatory, default is true
        ))
    ;
}

So when i try to make different label like this (i want to include the dimensions of the image the admin to know what image need to be provided):

        ->add('imageLeadFile', 'vich_image', array(
            'label'=>'Lead image Home Page (720x534)',
            'required' => false,
            'allow_delete' => true, // not mandatory, default is true
            'download_link' => true, // not mandatory, default is true
        ))

I got second label on top...

enter image description here

I have seen the uploader template and there has no label:

{% block vich_file_widget %}
{% spaceless %}
    <div class="vich-file">
        {{ form_row(form.file) }}
        {% if form.delete is defined %}
        {{ form_row(form.delete) }}
        {% endif %}

        {% if download_uri is defined and download_uri %}
        <a href="{{ download_uri }}">{{ 'download'|trans({}, 'VichUploaderBundle') }}</a>
        {% endif %}
    </div>
{% endspaceless %}
{% endblock %}

{% block vich_image_widget %}
{% spaceless %}
    <div class="vich-image">
        {{ form_row(form.file) }}
        {% if form.delete is defined %}
        {{ form_row(form.delete) }}
        {% endif %}

        {% if download_uri is defined and download_uri %}
         <a href="{{ download_uri }}"><img src="{{ download_uri }}" alt="" /></a>
        {% endif %}
        {% if show_download_link and download_uri is defined and download_uri%}
        <a href="{{ download_uri }}">{{ 'download'|trans({}, 'VichUploaderBundle') }}</a>
        {% endif %}
    </div>
{% endspaceless %}
{% endblock %}

The config to use the external twig files in the CoreBundle:

form_themes:
    # other form themes
    - 'CoreBundle:VichForm:fields.html.twig'

What could possibly make this?


Solution

  • It's an old question but it hasn't been answered properly, so, for future reference:

    In VichUploaderBundle template file 'fields.html.twig', do this:

    <div class="vich-file">
        {{ form_widget(form.file) }}
        {% if form.delete is defined %}
        {{ form_row(form.delete, {'label': 'Delete'}) }}
        {% endif %}
    

    And the same thing below for the image widget.

    <div class="vich-image">
        {{ form_widget(form.file) }}
        {% if form.delete is defined %}
        {{ form_row(form.delete, {'label': 'Delete'}) }}
        {% endif %}
    

    (This is just basic Twig BTW)