0

My django is not recognizing Java Script BootStrap, I have tried to open HTML without django and it is working, but when i put in django template dont work. Django not found the jquery.min.js and bootstrap.bundle.min.js please help me

My Terminal

[20/Oct/2021 10:08:42] "GET /auth/login/ HTTP/1.1" 200 2533
Not Found: /auth/login/js/jquery.min.js
Not Found: /auth/login/js/bootstrap.bundle.min.js

Html code

<html>
<head>

<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">

<script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script> 
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>

<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
 
<link rel="stylesheet" href="C:\Users\marco\OneDrive\Documentos\Python\Django\Jornal\jornal\templates\style.css">
</head>
<nav class="navbar navbar-expand navbar-dark background-color #070981" style="background-color: #070981;"> <a  href="#menu-toggle" id="menu-toggle" class="navbar-brand"><span class="navbar-toggler-icon"></span></a> <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarsExample02"  aria-controls="navbarsExample02" aria-expanded="false" aria-label="Toggle navigation"> <span class="navbar-toggler-icon"></span> </button>
    <div class="collapse navbar-collapse" id="navbarsExample02">
        <ul class="navbar-nav mr-auto" >
            <h1 class="nav-titulo" href="#" style="padding-left: 1px; color: #fff;">Esportivo Regional</h1>
            <li class="nav-item active" > <a class="nav-link" href="#"> <img src="C:\Users\marco\OneDrive\Documentos\Python\Django\Jornal\jornal\templates\logo.png" alt=""><span class="sr-only">(current)</span></a> </li>
        </ul>
        <form class="form-inline my-2 my-md-0" > </form>
    </div>
</nav>
<div id="wrapper" class="toggled">
    <!-- Sidebar -->
    <div id="sidebar-wrapper">
        <ul class="sidebar-nav">
            <li class="sidebar-brand"> Esportivo Regional </li>
            <li> <a href="#">Inicio</a> </li>
            <li> <a href="#">Login</a> </li>

        </ul>
    </div> <!-- /#sidebar-wrapper -->
    <!-- Page Content -->
    <div id="page-content-wrapper">
        <div class="container-fluid">
            <h1>Teste</h1>
        </div>
    </div> <!-- /#page-content-wrapper -->
</div> <!-- /#wrapper -->
<!-- Bootstrap core JavaScript -->
<script src="js/jquery.min.js"></script>
<script src="js/bootstrap.bundle.min.js"></script> <!-- Menu Toggle Script -->
<script>
  $(function(){
    $("#menu-toggle").click(function(e) {
        e.preventDefault();
        $("#wrapper").toggleClass("toggled");
    });

    $(window).resize(function(e) {
      if($(window).width()<=768){
        $("#wrapper").removeClass("toggled");
      }else{
        $("#wrapper").addClass("toggled");
      }
    });
  });
   
</script>

</html>

Settings.py Static Files

STATIC_URL = '/static/'
STATICFILES_DIRS = (os.path.join(BASE_DIR, 'templates/static'),)
STATIC_ROOT = os.path.join('static')

1 Answer 1

1

You are using the wrong syntax here....

if you want to use the static files you need to first load them with
{% load static %}

like this>>>>

    {% load static %}
    <script src="{% static 'js/jquery.min.js' %}"></script>
    <script src="{% static 'js/bootstrap.bundle.min.js' %}"></script>
Sign up to request clarification or add additional context in comments.

2 Comments

Still not working
Simply use jquary and bootstrap CDN

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.