0

I am trying to connect js to html in django.

When i include script inside html file it excetutes the command, however i created seperate js file and linked to django so it does not work whereas I linked css file and it works fine ,

I am learning and using tutorials some of them are old and i do not know whether i am using old style and this is why linking js to django does not work. Would be happy if you could help to understand where i am doing wrong:

in index.html

<!DOCTYPE html>
{% load static %}

<html lang="en" dir="ltr">
  <head>
    <meta charset="utf-8">

    <link rel="stylesheet" href="{% static 'school/css/main.css' %}">

  </head>
  <body>

    <div>{% block content %}{% endblock  %} </div>

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

  </body>

</html>

in settings i have : 

STATIC_URL = '/static/'
STATICFILES_DIRS = [os.path.join(BASE_DIR,'static')]

and main.js file: 

alert ("Hello");

My django version is my django version is 2.2.6

  • Could you give the full path to your static files please? – KrazyMax Apr 09 '20 at 08:20
  • what do you mean by full path ? i am new in django , You mean STATICFILES_DIRS = [os.path.join(BASE_DIR,'static')] or folder location of static files : static/school/js/main.js ? –  Apr 09 '20 at 10:15
  • This one: `static/school/js/main.js`. Where is located the `static` folder? In your `school` app? Or in your project folder? – KrazyMax Apr 09 '20 at 10:23
  • yes it is located in the school project in static folder. –  Apr 09 '20 at 10:25
  • school project where is the main url then under it i created static folder and under that i created folder school/ js/main.js –  Apr 09 '20 at 10:28
  • You have to be clear what is your project, and what are your apps (a project can have multiple apps). Have you created an app at least? To me, you've got a project I don't know the name, and an app called school. Is that correct? – KrazyMax Apr 09 '20 at 10:36
  • no my project name is school and the app name is result –  Apr 09 '20 at 10:38
  • Are you sure the `main.js` file is not loaded? By checking that in your web browser, do you have an error indicating the file has not been loaded? – KrazyMax Apr 09 '20 at 10:45
  • no error i see it does not make anythubg and that is. How i can check for error? –  Apr 09 '20 at 10:47
  • You select "dev tools" in your favorite web browser, then go to console, and check if there is an error indicating your file has been loaded or not. – KrazyMax Apr 09 '20 at 10:49
  • Does it change anything if you put your `js` code inside a `$(document).ready(function () { ... }` ? – KrazyMax Apr 09 '20 at 10:50
  • to insert in js file ? –  Apr 09 '20 at 10:51
  • nothing changes –  Apr 09 '20 at 10:52
  • Yes, in your `main.js` file, write this: `$(document).ready(function () { alert ("Hello"); }` – KrazyMax Apr 09 '20 at 10:53
  • ok... did you check for errors in your web browser? We need to know if the error comes from Django or from js. – KrazyMax Apr 09 '20 at 10:53
  • the only error i receive is : This page uses the non standard property “zoom”. Consider using calc() in the relevant property values, or using “transform” along with “transform-origin: 0 0”. –  Apr 09 '20 at 10:55
  • i do not know what is zoom as i haven't used it at all –  Apr 09 '20 at 10:59

1 Answers1

1

Depending on which version of Django you are using, {% load staticfiles %} no longer exists. I think this has been removed with Django 2.

I just found this: {% load static %} and {% load staticfiles %}: which is preferred?

Nina
  • 38
  • 5