Why my django4 Static JavaScript is not working?

Question

My html:

{% load static %}

<!doctype html>
<html lang="en">
  <head>
    
    
    <!-- Bootstrap CSS -->
   <link rel="stylesheet" type="text/css" href="{% static 'bootstrap/css/bootstrap-grid.min.css' %}" />
   <link rel="stylesheet" type="text/css" href="{% static 'bootstrap/css/bootstrap-reboot.min.css' %}" />
   <link rel="stylesheet" type="text/css" href="{% static 'bootstrap/css/bootstrap.min.css' %}" />
    <!-- Own CSS -->
    <link rel="stylesheet" type="text/css" href="{% static 'news/css/base.css' %}" />

  </head>
  <body>
 
<div class="topnav" id="myTopnav">
  <a href="#home" class="active">Home</a>
  <a href="#news">News</a>
  <a href="#contact">Contact</a>
  <div class="dropdown">
    <button class="dropbtn">Dropdown 
      <i class="fa fa-caret-down"></i>
    </button>
    <div class="dropdown-content">
      <a href="#">Link 1</a>
      <a href="#">Link 2</a>
      <a href="#">Link 3</a>
    </div>
  </div> 
  <a href="#about">About</a>
  <a href="javascript:void(0);" style="font-size:15px;" class="icon" onclick="myFunction()">&#9776;</a>
</div>

<div style="padding-left:16px">
  <h2>Responsive Topnav with Dropdown</h2>
  <p>Resize the browser window to see how it works.</p>
  <p>Hover over the dropdown button to open the dropdown menu.</p>
</div>


  <!--First own js, then other js-->
   
  <script type="text/javascript" src="{% static 'news/js/base.js' %}"></script>
  <script type="text/javascript" src="{% static 'bootstrap/js/bootstrap.bundle.min.js' %}"></script>
  <script type="text/javascript" src="{% static 'bootstrap/js/bootstrap.min.js' %}"></script>
 </body>
</html>

My dir:

blog --news

--template

--static

----bootstrap

------css

------js

----news

------css

--------base.css

------js

--------base.js

--media

Settings and urls:

MEDIA_URL = '/media/' MEDIA_ROOT = os.path.join(BASE_DIR, 'media')

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

urlpatterns += staticfiles_urlpatterns() if settings.DEBUG: urlpatterns += static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT) urlpatterns += static(settings.STATIC_URL, document_root=settings.STATIC_ROOT)

my base.js:

function myFunction() {
    var x = document.getElementById("myTopnav");
    if (x.className === "topnav") {
      x.className += " responsive";
    } else {
      x.className = "topnav";
    }
  }

STATIC_DIR - no such option. it's STATIC_ROOT. And please post code as code with appropriate formatting so keep it readable. — IVNSTN
– IVNSTN, Commented Oct 17, 2022 at 12:50

Mahammadhusain kadiwala · Accepted Answer · 2022-10-17 12:05:13Z

1

just set static path like this

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

answered Oct 17, 2022 at 12:05

Mahammadhusain kadiwala

3,6702 gold badges9 silver badges17 bronze badges

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

Collectives™ on Stack Overflow

Why my django4 Static JavaScript is not working?

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related