sonata-project / SonataAdminBundle

The missing Symfony Admin Generator
https://docs.sonata-project.org/projects/SonataAdminBundle
MIT License
2.11k stars 1.26k forks source link

Placeholder text not displayed with select2 #7305

Closed tifabien closed 3 years ago

tifabien commented 3 years ago

Environment

Sonata packages

show

``` $ composer show --latest 'sonata-project/*' sonata-project/admin-bundle dev-master 9bbdf97 dev-master 9bbdf97 The missing Symfony Admin Generator sonata-project/block-bundle 4.6.0 4.6.0 Symfony SonataBlockBundle sonata-project/cache 2.1.1 2.1.1 Cache library sonata-project/datagrid-bundle 3.3.0 3.3.0 Symfony SonataDatagridBundle sonata-project/doctrine-extensions 1.13.0 1.13.0 Doctrine2 behavioral extensions sonata-project/doctrine-orm-admin-bundle dev-master df32d93 dev-master df32d93 Integrate Doctrine ORM into the SonataAdminBundle sonata-project/exporter 2.7.0 2.7.0 Lightweight Exporter library sonata-project/form-extensions 1.9.0 1.9.0 Symfony form extensions sonata-project/media-bundle dev-master 1d467fe dev-master 1d467fe Symfony SonataMediaBundle sonata-project/twig-extensions 1.6.0 1.6.0 Sonata twig extensions ```

Symfony packages

show

``` $ composer show --latest 'symfony/*' symfony/amqp-messenger v5.3.2 v5.3.2 Symfony AMQP extension Messenger Bridge symfony/asset v5.3.2 v5.3.2 Manages URL generation and versioning of web assets such as CSS stylesheets, JavaScript files and image files symfony/browser-kit v5.3.0 v5.3.0 Simulates the behavior of a web browser, allowing you to make requests, click on links and submit forms programmatically symfony/cache v5.3.3 v5.3.3 Provides an extended PSR-6, PSR-16 (and tags) implementation symfony/cache-contracts v2.4.0 v2.4.0 Generic abstractions related to caching symfony/config v5.3.3 v5.3.3 Helps you find, load, combine, autofill and validate configuration values of any kind symfony/console v5.3.2 v5.3.2 Eases the creation of beautiful and testable command line interfaces symfony/css-selector v5.3.0 v5.3.0 Converts CSS selectors to XPath expressions symfony/debug-bundle v5.3.0 v5.3.0 Provides a tight integration of the Symfony Debug component into the Symfony full-stack framework symfony/dependency-injection v5.3.3 v5.3.3 Allows you to standardize and centralize the way objects are constructed in your application symfony/deprecation-contracts v2.4.0 v2.4.0 A generic function and convention to trigger deprecation notices symfony/doctrine-bridge v5.3.3 v5.3.3 Provides integration for Doctrine with various Symfony components symfony/doctrine-messenger v5.3.2 v5.3.2 Symfony Doctrine Messenger Bridge symfony/dom-crawler v5.3.0 v5.3.0 Eases DOM navigation for HTML and XML documents symfony/dotenv v5.3.0 v5.3.0 Registers environment variables from a .env file symfony/error-handler v5.3.3 v5.3.3 Provides tools to manage errors and ease debugging PHP code symfony/event-dispatcher v5.3.0 v5.3.0 Provides tools that allow your application components to communicate with each other by dispatching events and listening to them symfony/event-dispatcher-contracts v2.4.0 v2.4.0 Generic abstractions related to dispatching event symfony/expression-language v5.3.0 v5.3.0 Provides an engine that can compile and evaluate expressions symfony/filesystem v5.3.3 v5.3.3 Provides basic utilities for the filesystem symfony/finder v5.3.0 v5.3.0 Finds files and directories via an intuitive fluent interface symfony/flex v1.13.3 v1.13.3 Composer plugin for Symfony symfony/form v5.3.3 v5.3.3 Allows to easily create, process and reuse HTML forms symfony/framework-bundle v5.3.3 v5.3.3 Provides a tight integration between Symfony components and the Symfony full-stack framework symfony/http-client v5.3.3 v5.3.3 Provides powerful methods to fetch HTTP resources synchronously or asynchronously symfony/http-client-contracts v2.4.0 v2.4.0 Generic abstractions related to HTTP clients symfony/http-foundation v5.3.3 v5.3.3 Defines an object-oriented layer for the HTTP specification symfony/http-kernel v5.3.3 v5.3.3 Provides a structured process for converting a Request into a Response symfony/intl v5.3.0 v5.3.0 Provides a PHP replacement layer for the C intl extension that includes additional data from the ICU library symfony/mailer v5.3.3 v5.3.3 Helps sending emails symfony/maker-bundle v1.33.0 v1.33.0 Symfony Maker helps you create empty commands, controllers, form classes, tests and more so you can forget about writing boilerplate code. symfony/messenger v5.3.3 v5.3.3 Helps applications send and receive messages to/from other applications or via message queues symfony/mime v5.3.2 v5.3.2 Allows manipulating MIME messages symfony/monolog-bridge v5.3.3 v5.3.3 Provides integration for Monolog with various Symfony components symfony/monolog-bundle v3.7.0 v3.7.0 Symfony MonologBundle symfony/options-resolver v5.3.0 v5.3.0 Provides an improved replacement for the array_replace PHP function symfony/password-hasher v5.3.3 v5.3.3 Provides password hashing utilities symfony/phpunit-bridge v5.3.3 v5.3.3 Provides utilities for PHPUnit, especially user deprecation notices management symfony/polyfill-ctype v1.23.0 v1.23.0 Symfony polyfill for ctype functions symfony/polyfill-intl-grapheme v1.23.0 v1.23.0 Symfony polyfill for intl's grapheme_* functions symfony/polyfill-intl-icu v1.23.0 v1.23.0 Symfony polyfill for intl's ICU-related data and classes symfony/polyfill-intl-idn v1.23.0 v1.23.0 Symfony polyfill for intl's idn_to_ascii and idn_to_utf8 functions symfony/polyfill-intl-normalizer v1.23.0 v1.23.0 Symfony polyfill for intl's Normalizer class and related functions symfony/polyfill-mbstring v1.23.0 v1.23.0 Symfony polyfill for the Mbstring extension symfony/polyfill-php72 v1.23.0 v1.23.0 Symfony polyfill backporting some PHP 7.2+ features to lower PHP versions symfony/polyfill-php73 v1.23.0 v1.23.0 Symfony polyfill backporting some PHP 7.3+ features to lower PHP versions symfony/polyfill-php80 v1.23.0 v1.23.0 Symfony polyfill backporting some PHP 8.0+ features to lower PHP versions symfony/polyfill-php81 v1.23.0 v1.23.0 Symfony polyfill backporting some PHP 8.1+ features to lower PHP versions symfony/process v5.3.2 v5.3.2 Executes commands in sub-processes symfony/property-access v5.3.0 v5.3.0 Provides functions to read and write from/to an object or array using a simple string notation symfony/property-info v5.3.1 v5.3.1 Extracts information about PHP class' properties using metadata of popular sources symfony/proxy-manager-bridge v5.3.0 v5.3.0 Provides integration for ProxyManager with various Symfony components symfony/redis-messenger v5.3.2 v5.3.2 Symfony Redis extension Messenger Bridge symfony/routing v5.3.0 v5.3.0 Maps an HTTP request to a set of configuration variables symfony/security-acl v3.1.2 v3.1.2 Symfony Security Component - ACL (Access Control List) symfony/security-bundle v5.3.3 v5.3.3 Provides a tight integration of the Security component into the Symfony full-stack framework symfony/security-core v5.3.3 v5.3.3 Symfony Security Component - Core Library symfony/security-csrf v5.3.3 v5.3.3 Symfony Security Component - CSRF Library symfony/security-guard v5.3.0 v5.3.0 Symfony Security Component - Guard symfony/security-http v5.3.3 v5.3.3 Symfony Security Component - HTTP Integration symfony/serializer v5.3.2 v5.3.2 Handles serializing and deserializing data structures, including object graphs, into array structures or other formats like XML and JSON. symfony/service-contracts v2.4.0 v2.4.0 Generic abstractions related to writing services symfony/stopwatch v5.3.0 v5.3.0 Provides a way to profile code symfony/string v5.3.3 v5.3.3 Provides an object-oriented API to strings and deals with bytes, UTF-8 code points and grapheme clusters in a unified way symfony/translation v5.3.3 v5.3.3 Provides tools to internationalize your application symfony/translation-contracts v2.4.0 v2.4.0 Generic abstractions related to translation symfony/twig-bridge v5.3.3 v5.3.3 Provides integration for Twig with various Symfony components symfony/twig-bundle v5.3.3 v5.3.3 Provides a tight integration of Twig into the Symfony full-stack framework symfony/validator v5.3.3 v5.3.3 Provides tools to validate values symfony/var-dumper v5.3.3 v5.3.3 Provides mechanisms for walking through any arbitrary PHP variable symfony/var-exporter v5.3.3 v5.3.3 Allows exporting any serializable PHP data structure to plain PHP code symfony/web-link v5.3.3 v5.3.3 Manages links between resources symfony/web-profiler-bundle v5.3.2 v5.3.2 Provides a development tool that gives detailed information about the execution of any request symfony/yaml v5.3.3 v5.3.3 Loads and dumps YAML files ```

PHP version

$ php -v
PHP 8.0.7 (cli) (built: Jun  4 2021 21:26:10) ( NTS )
Copyright (c) The PHP Group
Zend Engine v4.0.7, Copyright (c) Zend Technologies
    with Zend OPcache v8.0.7, Copyright (c), by Zend Technologies

Subject

When using a simple ChoiceType with a placeholder in an edit view, the field is not rendered with the placeholder in select2

Minimal repository with the bug

Steps to reproduce

Add a field in the edit view

$formMapper
    ->add('duration', ChoiceType::class, [
        'label' => 'duration',
        'choices' => [
            '10s' => 10000,
            '20s' => 20000,
            '30s' => 30000,
        ],
        'placeholder' => 'auto',
    ])
;

Expected results

The auto placeholder is correctly rendered.

Actual results

image

VincentLanglet commented 3 years ago

@willemverspyck @cecicifu You recently worked on select2 and are using the master branch. Do you encounter this issue too ? Do you know how to solve it ?

willemverspyck commented 3 years ago

@VincentLanglet I was not using the placeholder, but I have the same issue on the master branch.

I will have a look what could be the problem.

willemverspyck commented 3 years ago

Hi @VincentLanglet. For autocomplete the placeholder works correctly. The problem is only at ChoiceType. I think the problem started after upgrading to Select2 version 4 on master branche, because it's not in 3.x branche.

As I understand the placeholder must be set in Select2 with direct javascript or data-placeholder="". So the solution will be to remove the first

But the difficult part is that developers can disable Select2. So what I did:

Disable Select2 in config: Show first

Is this the correct way you think? See commit: https://github.com/willemverspyck/SonataAdminBundle/commit/06f10c9e9671eb3448420c285ad424d58960c8fc

VincentLanglet commented 3 years ago

Hi @VincentLanglet. For autocomplete the placeholder works correctly. The problem is only at ChoiceType. I think the problem started after upgrading to Select2 version 4 on master branche, because it's not in 3.x branche.

As I understand the placeholder must be set in Select2 with direct javascript or data-placeholder="". So the solution will be to remove the first with placeholder value and add data-placeholder="Placeholder value". It works fine then.

Yes it seems like it must be done with javascript https://select2.org/placeholders

But the difficult part is that developers can disable Select2. So what I did:

Disable Select2 in config: Show first with placeholder Enable Select2 in config: Don't show first with placeholder and add data-placeholder attribute to select tag.

Is this the correct way you think? See commit: willemverspyck@06f10c9

I don't see any other option. Best would be to open a PR with some before/after screenshot.

I'd say that if it works and we have nothing else, it's the best solution ^^