Bonjour à tous,

Lorsque je mets plus d'un script js dans Twig, même si je les mets en "Defer" seul l'un d'entre eux est actif, j'ai pourtant aussi implémenté des window.onload dans ceux-ci...

Pour faire marcher et tester un script je suis donc obligé de "commenter" l'autre sous peine de blocage...
Aucun message d'erreur n'apparait ...

A noter que mon projet incluait webpack Encore que j'ai désinstallé... (Cela viendrait il de là ? des traces restantes ?)

Merci d'avance pour votre aimable aide.

``{% extends "base.html.twig" %}
{% block title %}Liste des véhicules
{% endblock %}
{% block body %}

<div class="main">

    <h1 class="titre-principal">Liste des véhicules</h1>

    {% if is_granted(['ROLE_ADMIN']) %}
        <a href="{{path('app_vehicules_creer_vehicule')}}" class="btn btn-primary">Créer un nouveau véhicule</a>
    {% endif %}

    <p class="resultat-filtre">Total véhicules dans la base =
        {{totalVehicules}}</p>
    <p class="resultat-filtre">Résultats filtre actif =
        {{totalVehiculesFiltered}}</p>

    {# Sliders double range #}
    {{ include('_partials/_sliders.html.twig') }}

    <div
        class="wrapper">
        {# Filtre multicritère : #}
        <div class="filtres">

            <form
                id="filters" class="filtersForm">

                {# Filtre sur type de véhicule #}
                <fieldset>
                    <legend>Type :</legend>
                    {% for  type in typesVehicules %}
                        <div class="wrapper-input">
                            <input type="checkbox" name="types[]" id="types{{type.id}}" value="{{type.id}}" class="filtreTypes">
                            <label for="types{{type.id}}">{{type.nomtype}}</label>
                        </div>
                    {% endfor %}
                </fieldset>

                {# Filtre sur marques de véhicules #}
                <fieldset>
                    <legend>Marque :</legend>
                    {% for  marque in marquesVehicules %}

                        <input type="checkbox" name="marques[]" id="marques{{marque.id}}" value="{{marque.id}}" class="filtreMarques">
                        <label for="marques{{marque.id}}">{{marque.marque}}</label>

                    {% endfor %}
                </fieldset>

                <input type="hidden" name="page" value="{{page}}">
            </form>
        </div>

        <div
            class="cards-container" id="content">

            {# Contenu généré en Ajax #}
            {{ include('vehicules/_content.html.twig') }}
        </div>
    </div>
</div>
    {% block javascripts %}
        <script src="{{asset('assets/js/annonces.js')}}" type="module" defer></script>
        <script src="{{asset('assets/js/filters.js')}}" type="module" defer></script>
    {% endblock %}

{% endblock %}
``

3 réponses


Bonjour,

Met ton block javascripts à l'exterieur de ton block body, et rajoute {{ parent() }} au debut du block javascripts pour ne pas écraser les scripts que tu as inclus dans le block javascripts du template base.html.twig.

Hello,

J'aurais plutôt mis le JS dans la <head>, d'ailleurs c'est à ça que sert l'attribut "defer" (sinon il faut le mettre tout en bas du document, avant la fermeture du <body>).

En ce qui concerne ton problème, il faudrait nous donner plus d'info, si tu a un script qui bloque l'autre, c'est peut être plus un problème Javascript qu'un problème Twig.
Est-ce que tu a des warnings ou des erreurs dans la console JS ?

Merci pour vos réponses,

Je pense que tout va fonctionner maintenant, j'ai tellement fait d'expériences ... lol
Si ça se reproduit je vous le signalerais ...

Merci en tous cas