Symfony 4.1 issues - Githubissues

christian-lorenz commented 5 years ago

BraincraftedBootstrapBundle isn't supported in symfony 4, i tried MopaBootstrapBundle instead.
TetranzSelect2EntityBundle:Form:fields.html.twig can't be found (I just copied it then into the project)
'remote_route' seems to be ignored - ajax requests always go to the current url

I'm using https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.6-rc.0/js/select2.min.js and asset('bundles/tetranzselect2entity/js/select2entity.js')

mvjuravlev commented 5 years ago

Try Webpack Encore. https://symfony.com/doc/current/frontend.html . There is no need to install this bundles at all. Just run "yarn add bootstrap" and include it in your project.
For symfony 4 correct path is @TetranzSelect2Entity/Form/fields.html.twig. But...
'remote_route' and 'remote_path' still ignored. I checked the select2 source and found that comment: "Select2: The data-ajax-url attribute has been changed to data-ajax--url and support for the old attribute will be removed in future versions of Select2.". Themplate fields.html.twig has "'data-ajax--url':remote_path, ", but it seems that this correct part is not working. The solution was to copy fields.html.twig in project, and change "data-ajax--url" back to "data-ajax-url". Now remote_route works fine. I'm using symfony 4.1, bootstrap 4.1.3, select2 4.0.6-rc.1 and select2-bootstrap4-theme 1.0.0

markus-fischbacher commented 5 years ago

@mvjuravlev can you tell me please, which steps are necessary to get this bundle working in symfony 4 with encore? Just fighting with that for hours :(

I'm using: Symfony 4.2.3 Select2 4.0.6-rc.1 Bootstrap v4.3.1 select2-bootstrap4-theme 1.0.0

app.scss

@import "~bootstrap/scss/bootstrap";
@import "~select2-bootstrap4-theme";

app.js

require('../css/app.scss');
global.$ = global.jQuery = require('jquery');
require('bootstrap');
require('select2');

base.html.twig

<head>
    <meta charset="UTF-8">
    <title>{% block title %}Portal{% endblock %}</title>
    {{ encore_entry_link_tags('app') }}
    {% block stylesheets %}
    {% endblock %}
</head>
<body>
...
{{ encore_entry_script_tags('app') }}
    {% block javascripts %}
        <script src="{{ asset('bundles/tetranzselect2entity/js/select2entity.js') }}"></script>
    {% endblock %}
</body>

twig.yaml

twig:
    default_path: '%kernel.project_dir%/templates'
    debug: '%kernel.debug%'
    strict_variables: '%kernel.debug%'
    form_themes:
        - 'bootstrap_4_layout.html.twig'
        - '@TetranzSelect2Entity/Form/fields.html.twig'

And it's looking like:

Thank you!

markus-fischbacher commented 5 years ago

Just found the problem :)

    {% block stylesheets %}
        <link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.2/css/select2.min.css" rel="stylesheet" />
    {% endblock %}

Optionally @import "~select2/dist/css/select2.min.css";

I missed to link the select2.css

tetranz / select2entity-bundle

Symfony 4.1 issues #129