I am trying to see the details of my created requests but the url to enter the details is not recognized. I don’t know what it could be. I will attach the views of my code. If you can help me, please.
html
{% extends 'base.html' %}
{% load static %}
{% block content %}
{% include 'nav.html' with active='new1' %}
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" integrity="sha384-rbsA2VBKQhggwzxH7pPCaAqO46MgnOM80zW1RWuH61DGLwZJEdK2Kadq2F9CUG65" crossorigin="anonymous" />
<!-- DataTable.js -->
<link rel="stylesheet" href="https://cdn.datatables.net/1.13.1/css/dataTables.bootstrap5.min.css" />
<!-- Font Awesome -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.2.1/css/all.min.css" />
<!-- Custom CSS -->
<link rel="stylesheet" href="{% static 'css/index.css' %}" />
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/css/select2.min.css">
<br>
<br>
<div class="hstack gap-3">
<div class="p-2"><h3>Solicitudes </h3></div>
<div class="p-2 ms-auto"></div>
<div class="p-2"><a class="btn btn-primary btn-md" href="{% url 'crear_solicitud' %}">Crear OC</a> </div>
</div>
<br>
<div class="container">
<table id="datatable-programmers" class="table table-hover">
<thead class="table table-primary">
<tr>
<th>#</th>
<th>Código</th>
<th>Asunto</th>
<th>Descripción</th>
<th>Estado</th>
<th>Plazo de Pago</th>
<th></th>
</tr>
</thead>
<tbody id="tableBody_programmers">
<!-- Los resultados se mostrarán aquí -->
</tbody>
<br>
<br>
</div>
<!-- Bootstrap -->
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-kenU1KFdBIe4zVF0s0G1M5b4hcpxyD9F7jL+jjXkk+Q2h455rYXK/7HAuoJl+0I4" crossorigin="anonymous"></script>
<!-- jQuery -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<!-- DataTable.js -->
<script src="https://cdn.datatables.net/1.13.1/js/jquery.dataTables.min.js"></script>
<script src="https://cdn.datatables.net/1.13.1/js/dataTables.bootstrap5.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/js/select2.min.js"></script>
<script >
let dataTable;
let dataTableIsInitialized = false;
const dataTableOptions = {
columnDefs: [
{ className: "centered", targets: [0, 1, 2, 3, 4, 5, 6] },
{ orderable: false, targets: [5, 6] },
],
pageLength: 10,
destroy: true,
language: {
lengthMenu: "Mostrar _MENU_ registros por página",
zeroRecords: "Ningún usuario encontrado",
info: "Mostrando de _START_ a _END_ de un total de _TOTAL_ registros",
infoEmpty: "Ningún usuario encontrado",
infoFiltered: "(filtrados desde _MAX_ registros totales)",
search: "Buscar:",
loadingRecords: "Cargando...",
paginate: {
first: "Primero",
last: "Último",
next: "Siguiente",
previous: "Anterior"
}
}
};
const initDataTable = async () => {
if (dataTableIsInitialized) {
dataTable.destroy();
}
await listProgrammers();
dataTable = $("#datatable-programmers").DataTable(dataTableOptions);
dataTableIsInitialized = true;
};
const listProgrammers = async () => {
try {
const response = await fetch("http://localhost:8000/listar_solicitudes/rector");
const data = await response.json();
let content = ``;
data.programmers.forEach((programmer, index) => {
content += `
<tr>
<td>${programmer.pk}</td>
<td >${programmer.codigo}</td>
<td>${programmer.asunto}</td>
<td class="col-2">${programmer.descripcion}</td>
<td>${programmer.plazo_pago}</td>
<td>${programmer.sede }</td>
<td>
<a class='btn btn-sm btn-success' href="{% url 'solicitud_detail' programmer_id=programmer.pk %}" title="Detalles"><i class="fa-solid fa-eye"></i></a>
<a class='btn btn-sm btn-primary' title="Editar" href="{% url 'crear_solicitud' %}"> <i class='fa-solid fa-pencil'></i></a>
<button class='btn btn-sm btn-danger' title="Eliminar" ><i class='fa-solid fa-trash-can'></i></button>
</td>
</tr>`;
});
tableBody_programmers.innerHTML = content;
} catch (ex) {
alert(ex);
}
};
window.addEventListener("load", async () => {
await initDataTable();
});
</script>
{% endblock %}
views.py
def listar_solicitudes_rector(request):
solicitudes = Solicitud.objects.all()
programmers = []
for solicitud in solicitudes:
programmers.append({
'pk':solicitud.pk,
'codigo': solicitud.codigo,
'asunto': solicitud.asunto,
'descripcion': solicitud.descripcion,
'estado': solicitud.Estado.name if solicitud.Estado else '',
'plazo_pago': solicitud.plazo_pago.name,
'sede': solicitud.sede.name if solicitud.sede else '',
'presupuesto': solicitud.presupuesto.ID_Presupuesto if solicitud.presupuesto else '',
'creado': solicitud.creado.strftime('%d-%m-%Y'),
'creada_por': solicitud.creada_por.username if solicitud.creada_por else '',
})
data = ({'programmers': programmers})
return JsonResponse(data)
def Details_solicitudes(request, programmer_id):
solicitud = get_object_or_404(Solicitud, pk=programmer_id)
def Solicitudes_List_Rector(request):
return render(request, 'rector/solicitudes_list.html')
urls.py
path('solicitud_detail/<int:programmer_id>/', views.Details_solicitudes, name='solicitud_detail'),
path ('Solicitudes_list/rector', views.Solicitudes_List_Rector, name='solicitudes_list_rector'),
path('listar_solicitudes/rector', views.listar_solicitudes_rector, name='listar_solicitudes_rector'),
I have tried everything to change variables, leaving it as a static loop but I need it to be done through javascripts, I would like to know what I am doing wrong and how I can solve it with your help and it is possible.