I am doing a CRUD of interested parties and course. Anyone interested can be interested in any course. I bring all the data of the course and the interested parties, but then in the html everything is put in the first course. I need each interested to appear in the table of each course but put everything in the first course. It seems to me that something has to be changed here in the javascript, nothing else, but I don't realize that
code_cursos.js:
this.listar_interesados_curso = (curso) => {
var form = new FormData();
form.append("id_curso", curso.id_curso);
fetch("../controllers/listado_interesados_curso.php", {
method: "POST",
body: form,
})
.then((res) => res.json())
.then((data) => {
this.interesados_por_curso.innerHTML += `
<div class="row justify-content-center p-5 col-sm-10">
<div>
<h5>Curso: "${curso.nombre}"</h5>
<table class="table text-center">
<thead>
<tr>
<th>#</th>
<th>Nombre</th>
<th>Apellido</th>
<th>Teléfono</th>
<th>Email</th>
<th>Dirección</th>
<th>Localidad</th>
<th>DNI</th>
</tr>
</thead>
<tbody id="interesados_por_curso_datos"></tbody>
</table>
</div>
</div>
`;
data.forEach((item) => {
var form_interesados = new FormData();
form_interesados.append("id_interesado", item['id_interesado']);
fetch("../controllers/obtener_datos_interesados.php", {
method: "POST",
body: form_interesados
})
.then((res) => res.json())
.then((data) => {
this.interesados_por_curso_datos = document.getElementById("interesados_por_curso_datos");
this.interesados_por_curso_datos.innerHTML += `
<tr>
<td>${data["id_interesado"]}</td>
<td>${data["nombre"]}</td>
<td>${data["apellido"]}</td>
<td>${data["telefono"]}</td>
<td>${data["email"]}</td>
<td>${data["direccion"] + " " + data["numero"]}</td>
<td>${data["localidad"]}</td>
<td>${data["dni"]}</td>
</tr>
`;
});
})
})
}
}
The problem is that you are always using the same
id
one and there can only be a single element withid="interesados_por_curso_datos"
Solution:
You could add to
id
each course table, thecurso_id
and thus be able to identify them with a unique ID.Then:
<tbdoy>
like this:<tbody>
like this:Code: