Symfony 4 - Используйте загрузчик 4 с Select2 - PullRequest
0 голосов
/ 25 октября 2019

в моем проекте Symfony 4 я использую Select2 для некоторых из моих полей: https://select2.org/

Итак, у меня есть это:

enter image description here

Итак, в моей форме я имею:

->add('user', EntityType::class, [
                'class' => User::class,
                'label' => 'Agent',
                'placeholder' => "Agent",
                'choice_label' => 'fullName',
                'choice_value' => 'fullName',
                'attr' => [
                    'class' => 'js-example-basic-single',
                ]
            ])

И, на мой взгляд:

<link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.8/css/select2.min.css" rel="stylesheet"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.8/js/select2.min.js"></script>

<script>
        $('.js-example-basic-single').select2({
            placeholder: 'Choisissez un agent',
            allowClear: true,
            language: 'fr'
            });
    </script>

Я хотел бы использовать bootstrap 4 с этим полем, чтобыон имеет тот же дизайн, что и другие поля.

Итак, я нашел эту ссылку: https://github.com/ttskch/select2-bootstrap4-theme Это хорошая ссылка?

Я впервые использую npm, поэтомуЯ выполнил следующую команду:

npm install @ ttskch / select2-bootstrap4-theme

Но я не вижу, где находятся ссылки css, чтобы импортировать их на мой взгляд

1 Ответ

1 голос
/ 25 октября 2019

Вам просто нужно указать правильное имя темы в определении поля select2. Так что в вашем случае это будет выглядеть так:

 <script>
        $('.js-example-basic-single').select2({
            placeholder: 'Choisissez un agent',
            allowClear: true,
            language: 'fr',
            theme: 'bootstrap4',
            });
    </script>

Если вы используете веб-пакет, как предполагает официальная документация, вы должны добавить следующие строки:

assets / js / app.js

require('select2');

assets / css / app.scss:

@import "~select2-bootstrap4-theme/dist/select2-bootstrap4.min.css";
...