How to handle JS script with Django template language?

Question

I'm trying to use Django template language to manipulate JS scripts, but when I try appears the following error

I checked the error in case there is a miss typed code, but I couldn't detect it.

How is the best way to handle multiple JS script with multiple HTML files in Django template language?

Infraestructura.html

{% extends "Portafolio/layout.html" %}


{% block scripts %}
<script src = "{% static 'Portafolio/scriptinfra.js' %}" type="text/javascript"></script>    
{% endblock %}



{% block content %}

<form class="form mt-5" id="infra">
    <h1>Factibilidad Técnica y Operativa</h1>
    <h2>Análisis de Infraestructura</h2>

    <main class="container">
      <section class="row">

        <div class="col-lg-4 mb-2">
          <input name='infs' class="form-control" type="text" placeholder="Infraestructura">
        </div>

        <div class="col-lg-4 mb-2">
          <input name='time' class="form-control" type="text" placeholder="Tiempo">
        </div>

        <div class="col-lg-4 mb-2">
          <input name='cost' class="form-control" type="text" placeholder="Costo Mensual">
        </div>
        
      </section>
    </main>

    <nav class="btn-group">
      <button id='add' class='btn btn-success' type='button'>
        <i class="fa fa-plus-square"></i> Añadir
      </button>
      <button id='rem' class='btn btn-danger' type='button'>
        <i class="fa fa-minus-square"></i> Eliminar
      </button>     
    </nav>
  </form>
  
  <form class="form mt-3">
    <div class="d-grid gap-2 mt-3">
      <a class="btn btn-lg btn-primary" href="tecnicoequipo.html">Siguiente</a>
    </div>

    <div class="d-grid gap-2 mt-3">
      <a class="btn btn-lg btn-primary" href="financierobeneficio.html">Atrás</a>
    </div>
  </form>
{% endblock %}

layout.html

{% load static %}

<!DOCTYPE html>
<html lang="es">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-+0n0xVW2eSR5OomGNYDnhzAbDsOXxcvSN1TPprVMTNDbiYZCxYbOOl7+AMvyTG2x" crossorigin="anonymous">
    <link rel="stylesheet" type="text/css" href= "{% static 'Portafolio/style.css' %}">
    
    {% block scripts %} <script src="{% static 'Portafolio/scriptinfra.js' %}" type="text/javascript"></script> {% endblock}



    <title>{% block title %} {% endblock %}</title> 
</head>
<body>
    {% block content %}
    
    {% endblock %}
</body>
</html>

Can you show us your settings.py folder?

Aaron Cloud
– Aaron Cloud

2021-06-22 02:40:32 +00:00
Commented Jun 22, 2021 at 2:40 — Aaron Cloud
– Aaron Cloud, Commented Jun 22, 2021 at 2:40

Thrillidas · Accepted Answer · 2021-06-22 03:57:44Z

1

You have to load static at the top of your HTML document in your Infraestructura.html like this

{% extends "Portafolio/layout.html" %}
{% load static %}

edited Jun 22, 2021 at 3:57

Thrillidas

797 bronze badges

answered Jun 22, 2021 at 2:27

Ankit Tiwari

4,7654 gold badges20 silver badges49 bronze badges

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

2 Comments

Thrillidas Over a year ago

Thank you so much ! but when I tried your code it appears an error saying that "extends" must be in first place, but besides that, everything is alright !

Ankit Tiwari Over a year ago

oh my bad, you have to put {% extends "Portafolio/layout.html" %} at the top of your page

Collectives™ on Stack Overflow

How to handle JS script with Django template language?

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related