CODEWITHSUNDEEP
javascriptpythoncssdjangotwitter-bootstrap
oScanner
oScanner

Reputation: 1

Django not recognizing base.html java script

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')

Upvotes: 0

Views: 264

Answers (1)

naresh kumar
naresh kumar

Reputation: 21

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>

Upvotes: 1

Related Questions