I see that the v4 sonata uses Webpack - I add
{% block sonata_javascript_pool %}
{% for javascript in sonata_config.getOption('javascripts', []) %}
<script src="{{ asset(javascript) }}"></script>
{% endfor %}
{% endblock %}
{# localize moment #}
{% set localeForMoment = canonicalize_locale_for_moment() %}
{% if localeForMoment %}
<script src="{{ asset('bundles/sonataform/moment-locale/' ~ localeForMoment ~ '.js') }}"></script>
{% endif %}
{# localize select2 #}
{% if sonata_config.getOption('use_select2') %}
{% set localeForSelect2 = canonicalize_locale_for_select2() %}
{% if localeForSelect2 %}
<script src="{{ asset('bundles/sonataadmin/select2-locale/' ~ localeForSelect2 ~ '.js') }}"></script>
{% endif %}
{% endif %}
{% endblock %}
{{ encore_entry_script_tags('myjs') }}
in myjs simple actions not working - I add select2 in the top menu and change events not working ...
here is the stimulus controller
import { Controller } from '@hotwired/stimulus';
export default class extends Controller {
connect() {
$(this.element).on('select2:initialized', () => {
this.element.addEventListener('change', this.handleChange.bind(this));
$(this.element).on('select2:select', this.handleChange.bind(this));
});
this.element.addEventListener('change', this.handleChange.bind(this));
this.element.addEventListener('selection:update', this.handleChange.bind(this));
$(this.element).on('select2:select', this.handleChange.bind(this));
}
select is self-change to select2 - think is sonata code.
maybe the conflict is from my webpack - so custom jQuery.. - how to extend sonta js / add my stimulus controllers?
cannot be found in doc https://docs.sonata-project.org/projects/SonataAdminBundle/en/4.x/
i add
console.log('stimulus',global.stimulus);
let app =global.sonataApplication;
const myControllersContext = require.context('./controllers', true, /\.[jt]sx?$/);
myControllersContext.keys().forEach(filename => {
const controllerName = filename.match(/\.\/(.+)_controller\.js$/)[1];
app.register(controllerName, myControllersContext(filename).default);
});
and add this js to admin - work but when i create controller for modals
import { Modal } from 'bootstrap';
export default class bootstrapModal {
filter toogle stop working ...
my packages.json
"bootstrap": "^3.4.1",
"jquery": "^3.6.4",
any suggest ?