1

I'm facing a new problem with django. I'm developping a website (so I'm not in the production step) and I want to use javascript in my template.

When I write my script directly on my template and link it to a button the script works. But when I want to import it from a .js file it doesn't works anymore.

My static directory seems to work correctly, I can import css or even images from it.

Here is my files :

base.html :

<!DOCTYPE html>
<html lang="en">

    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

        {% load static %}

        <title>Title</title>
        <link rel="stylesheet" href="{% static 'webcalendar/css/bootstrap.css' %}">
        <link rel="stylesheet" href="{% static 'webcalendar/css/style.css' %}">

        {% block script %}  {% endblock %}
    </head>

    <body>

        {% block content %}  {% endblock %}

    </body>
</html>

fonction_test.html : where the script is directly written in the template

{% extends 'webcalendar/base.html' %}

{% block script %}

    <script type="text/javascript">

        function printInConsole(){
                console.log("PRINTING...")
        }

    </script>

{% endblock %}

{% block content %}

    <button  onclick="printInConsole()" class="btn btn-warning">Print in console</button>

{% endblock %}

So the previous one is working.

But if I try to import the script from a .js file in the static folder of my app it doesn't works.

calendar.js :

function printInConsole(){
            console.log("PRINTING...")
    }

new fonction_test.html : where I try to import the script from the .js

{% extends 'webcalendar/base.html' %}
{% load static %}

{% block script %}

    <script type="text/javascript" scr="{% static 'webcalendar/js/calendar.js' %}"></script>

{% endblock %}

{% block content %}

    <button  onclick="printInConsole()" class="btn btn-warning">Print in console</button>

{% endblock %}

I get the following error :

ReferenceError: printInConsole is not defined

I must have done something wrong, do you have any tips to solve this ?

1
  • Can you try with path like this : <script src="path_to_your_static/static/webcalendar/js/calendar.js"></script>. Then it seems to not work because you wrote : scr and not src Commented Nov 5, 2018 at 15:51

1 Answer 1

1

To my mind, your issue comes from your syntax :

<script type="text/javascript" scr="{% static 'webcalendar/js/calendar.js' %}"></script>

Please change scr="" by src="

<script type="text/javascript" src="{% static 'webcalendar/js/calendar.js' %}"></script>

If you're statics are well-defined, it should work.

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

Comments

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.