2

When I am extending my base.html.twig my JS are loading twice. Here is my code:

{% block javascripts %}
{% javascripts
'@MyBundle/Resources/public/app/src/lib/jquery.js'
'@MyBundle/Resources/public/app/src/lib/jquery-ui.js'
'@MyBundle/Resources/public/app/src/lib/angular.js'
'@MyBundle/Resources/public/app/src/lib/ui-bootstrap-tpls-0.10.0.js'
'@MyBundle/Resources/public/app/src/lib/fullcalendar.js'
'@MyBundle/Resources/public/app/calendar.js'
'@MyBundle/Resources/public/app/src/lib/angular-route.js'
'@MyBundle/Resources/public/app/schedulePlanner.js'
 %}
<script type="text/javascript" src="{{ asset_url }}"></script>
{% endjavascripts %}
2
  • What do you mean by "they are loading twice"? Is the <script> tag included in the html output or what? loading twice in the network tab of devtools/firebug? pleae include the relevant parts of your (base) template in the question please. Commented Jan 31, 2014 at 8:39
  • Can you post the resulting HTML please? Commented Feb 10, 2014 at 4:36

1 Answer 1

16

I had a similar issue which turns out was caused by a misplaced {% endblock %} tag.

Here was my base view:

{# app/Resources/views/base.html.twig #}
<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8" />
        <title>{% block title %}{% endblock %}</title>
        {% block header %}{% endblock %}
        {% block stylesheets %}{% endblock %}
        <link rel="icon" type="image/x-icon" href="{{ asset('favicon.ico') }}" />
    </head>
    <body>
        <!--[if lt IE 9]>
            <p class="chromeframe">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a>.</p>
        <![endif]-->

        {# debug #}
        {% if pre is defined and pre is not empty and app.environment == 'dev' %}
            <pre>
                {{ pre }}
            </pre>
        {% endif %}

        {% block body %}{% endblock %}
        {% block javascripts %}{% endblock %}
    </body>
</html>

And here was the bundle template that extended:

{% extends "::base.html.twig" %}

{# title #}
{% block title %}{% endblock %}

{% block header %}
    <meta name="HandheldFriendly" content="True">
    <meta name="MobileOptimized" content="320">
    <meta name="viewport" content="width=device-width">
    <link href='http://fonts.googleapis.com/css?family=Pathway+Gothic+One' rel='stylesheet' type='text/css'>
{% endblock %}

{# style #}
{% block stylesheets %}
{% endblock %}

{# body #}
{% block body %}

    {% block content_header %}
        <div class="header"><div class="header-in">
            <header>
            </header>
        </div></div>

        <div class="nav"><div class="nav-in">
            <nav>
                <ul id="menu" class="menu clearfix">
                    {% block content_header_nav %}
                    {% endblock %}
                </ul>
            </nav>
        </div></div>
    {% endblock %}

    <div class="block"><div class="block-in">

        <div class="content"><div class="content-in clearfix">

            {% set notices = app.session.flashbag.get('notices') %}
            {% if notices is not empty %}
            <ul class="msg ajax-flash-msg">
              {% for notice in notices %}
              <li>{{ notice }}</li>
              {% endfor %}
            </ul>
            {% endif %}

            {% block content %}{% endblock %}

        </div></div>

    </div></div>

    <div class="footer"><div class="footer-in">
        <footer>
            {% block footer %}{% endblock %}
        </footer>
    </div></div>

    {# javascript #}
    {% block javascripts %}
    <script src="{{ asset('assets/require.js') }}"></script>
    {% endblock %}

{% endblock %}

You'll notice I had my javascript block inside of the body block in the bundle template which caused it to render twice upon html outputing to the browser.

To fix I moved the javascript block outside of the body block.

Sign up to request clarification or add additional context in comments.

2 Comments

I had the same problem. After several hours of investigating event bubbling issues, this turned out to be the solution. Thanks!
Oh man, thanks a lot! This has driven me crazy for a while now!

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.