Impossible d'interpréter du JS avec Twig

**Phobizeur** · 17/08/2015, 12h10

Amis du jour, bonjour !

Récemment je me suis mis à Symfony2 dans le but de construire un projet qui me tiens à cœur mais je bute sur un petit problème, je n'arrive pas à faire fonctionner mon JS dans Twig !!!

Voici le code dans twig qui ne marche pas :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
 
<html>
    <head>
        <title>MultiGamingTournament</title>
 
        {% block stylesheets %}
        <link rel="stylesheet" type="text/css" href="{{ asset('/css/jquery.bracket.css') }}" />
        {% endblock %}
    </head>
    <body>
 
        {% block javascripts %}
        <script src="{{ asset('/js/jquery.min.js') }}" type="text/javascript" ></script>
        <script src="{{ asset('/js/jquery-ui-1.8.16.custom.min.js') }}" type="text/javascript" ></script>
        <script src="{{ asset('/js/jquery.bracket.js') }}" type="text/javascript" ></script>
        <script src="{{ asset('/js/jquery.json-2.3.min.js') }}" type="text/javascript" ></script>
 
        <script type="text/javascript"> var autoCompleteData = {
                teams : [ ["Jean","Jack"],["",""] ],
		results : [ ] }</script>
 
        <script src="{{ asset('/js/brackets-rd.js') }}" type="text/javascript" ></script>
 
        {% endblock %}
 
        <div id="autoComplete"></div>
 
        <h1>{{ odc.nom }}</h1>
        <p> {{ odc.equipes }} </p>
 
 
 
    </body>
</html>

Et pourtant j'ai bien mis les scripts JS dans le fichier ressource/public de mon bundle.

Le code en php qui marche parfaitement :

<html>
<head>
<title>MultiGamingTournament</title>
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery-ui-1.8.16.custom.min.js"></script>
<script type="text/javascript" src="js/jquery.bracket.js"></script>
<script type="text/javascript" src="js/jquery.json-2.3.min.js"></script>
echo '<script type="text/javascript">var autoCompleteData = {
teams : [ ["Jean","Jack"],["",""] ],
results : [ ] }</script>';
<script type="text/javascript" src="js/brackets-rd.js"></script>
<?php /* } */ ?>

<link rel="stylesheet" type="text/css" href="css/jquery.bracket.css" />
</head>
<body>
<div id="autoComplete"></div>
</body>
</html>

Merci d'avance de votre aide !

Bonne journée.

**arnooo999** · 17/08/2015, 12h44

Bonjour,

cela vient du fait que twig possède plusieurs stratégie pour escaper le contenu (html, js, ...)
cf : http://twig.sensiolabs.org/doc/filters/escape.html

une solution simple sans avoir à jouer sur le paramètres escape

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
 
{%set autoCompleteDataInTwig = {"teams": [ ["Jean","Jack"],["test","toto"]]} %}
<script type="text/javascript"> var autoCompleteData = {{ autoCompleteDataInTwig | json_encode }}</script>

**Phobizeur** · 17/08/2015, 13h36

Envoyé par arnooo999

Bonjour,

cela vient du fait que twig possède plusieurs stratégie pour escaper le contenu (html, js, ...)
cf : http://twig.sensiolabs.org/doc/filters/escape.html

une solution simple sans avoir à jouer sur le paramètres escape

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
 
{%set autoCompleteDataInTwig = {"teams": [ ["Jean","Jack"],["test","toto"]]} %}
<script type="text/javascript"> var autoCompleteData = {{ autoCompleteDataInTwig | json_encode }}</script>

Encore plus étonnant, j'ai modifié les routes et emplacements des assets pour que ça soit plus clean.

Il s’avère qu'avec votre code, rien ne s'affiche alors qu'avec le suivant :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
 
<html>
    <head>
        <title>MultiGamingTournament</title>
 
        {% block stylesheets %}
        <link rel="stylesheet" href="{{ asset('bundle/interactionjsonbdd/css/jquery.bracket.css') }}" />
        {% endblock %}
 
    </head>
    <body>
 
        {% block javascripts %}
        <script src="{{ asset('bundles/interactionjsonbdd/js/jquery.min.js') }}" type="text/javascript" ></script>
        <script src="{{ asset('bundles/interactionjsonbdd/js/jquery-ui-1.8.16.custom.min.js') }}" type="text/javascript" ></script>
        <script src="{{ asset('bundles/interactionjsonbdd/js/jquery.bracket.js') }}" type="text/javascript" ></script>
        <script src="{{ asset('bundles/interactionjsonbdd/js/jquery.json-2.3.min.js') }}" type="text/javascript" ></script>
 
        <script type="text/javascript">var autoCompleteData = {
            teams : [ ["Jean","Jack"],["",""] ],
            results : [ ] }</script>
 
        <script src="{{ asset('bundles/interactionjsonbdd/js/brackets-rd.js') }}" type="text/javascript" ></script>
        {% endblock %}
 
        <div id="autoComplete"></div>
 
        <h1>{{ odc.nom }}</h1>
        <p> {{ odc.equipes }} </p>
 
 
 
    </body>
</html>

J'ai le nom des équipes ainsi que leurs scores par défaut mais sans aucune mise en page...

En php :

Nom : php.PNG
Affichages : 456
Taille : 15,4 Ko

Avec twig :

Nom : twig.PNG
Affichages : 442
Taille : 16,9 Ko

**Alain-De-Loin** · 17/08/2015, 18h07

Nom : Capture1.PNG
Affichages : 438
Taille : 3,4 Ko

Crée le dossier js s'il n'est pas déjà créé dans web et copie tes fichier js.

Ensuite dans ton layout appel les comme ça :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<script src="{{ asset('js/tonFichierJS.js') }}"></script>

Impossible d'interpréter du JS avec Twig

Symfony PHP

Discussions similaires

Partager

Partager