promesa II

 Sí, es posible que el problema esté relacionado con la sincronización de la carga de datos. Utilizar una promesa podría ayudar a garantizar que los datos estén disponibles antes de intentar acceder a ellos. Aquí te muestro cómo podrías hacerlo con una promesa:


<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Tabla y Modal</title> <!-- Bootstrap CSS --> <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/css/bootstrap.min.css" rel="stylesheet"> </head> <body> <div class="container"> <input type="hidden" name="carpeta" id="inputCarpeta" value="C-01/2015"> <table id="solicitudtabla" class="table"> <thead class="thead-dark"> <tr> <th>Id</th> <th>Carpeta</th> <th>Registro</th> <th>Solicitud</th> <th>Fecha de Registro</th> <th>Comentario</th> <th>Fecha de Vencimiento</th> <th>Estado</th> <th>Resolvio</th> <th>Fecha de Contesto</th> </tr> </thead> <tbody id="tablaBody"></tbody> </table> <!-- Modal para la edición --> <div class="modal fade" id="modalEditar" tabindex="-1" aria-labelledby="modalEditarLabel" aria-hidden="true"> <div class="modal-dialog"> <div class="modal-content"> <div class="modal-header"> <h5 class="modal-title" id="modalEditarLabel">Editar Registro</h5> <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button> </div> <div class="modal-body"> <form id="formularioEditar"> <input type="hidden" name="id" id="editId"> <div class="mb-3"> <label for="editRegistro" class="form-label">Registro:</label> <input type="text" class="form-control" id="editRegistro" name="editRegistro"> </div> <div class="mb-3"> <label for="editPDF" class="form-label">PDF:</label> <input type="text" class="form-control" id="editPDF" name="editPDF"> </div> <button type="submit" class="btn btn-primary">Guardar Cambios</button> </form> </div> </div> </div> </div> </div> <!-- Bootstrap JS y Popper.js (Requerido por Bootstrap) --> <script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.11.6/dist/umd/popper.min.js"></script> <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/js/bootstrap.min.js"></script> <script> const tablaBody = document.getElementById('tablaBody'); let datos = []; obtenerDatos().then(() => { pintarTabla(datos); }).catch(error => { console.error('Error al obtener datos:', error); }); function obtenerDatos() { return new Promise((resolve, reject) => { const valorCarpeta = document.getElementById("inputCarpeta").value; fetch(`http://localhost/3-MVC-SITE-v5-SOLICITUDES/EJERCICIOS-COMPONENTES/componentes/0-solicitud_tabla.php?carpeta=${valorCarpeta}`) .then(res => res.json()) .then(data => { console.log(data.status); datos = data.result; resolve(); }) .catch(error => { reject(error); }); }); } function pintarTabla(datos) { let tablaHTML = ''; for (let dato of datos) { tablaHTML += ` <tr> <td>${dato.id}</td> <td>${dato.carpeta}</td> <td>${dato.registro || ''}</td> <td>${dato.solicitud || ''}</td> <td>${dato.f_registro || ''}</td> <td>${dato.comentario || ''}</td> <td>${dato.f_vence || ''}</td> <td> <button class="btn btn-primary" onclick="abrirModalEditar(${dato.id})">Editar</button> </td> <td>${dato.resolvio || ''}</td> <td>${dato.f_contesto || ''}</td> </tr> `; } tablaBody.innerHTML = tablaHTML; } function abrirModalEditar(id) { const dato = datos.find(item => item.id === id); console.log(dato); const modalElement = document.getElementById("modalEditar"); const modal = new bootstrap.Modal(modalElement); modal.show(); } </script> </body> </html>

En este código, he envuelto la obtención de datos dentro de una promesa para asegurarme de que los datos se carguen antes de intentar pintar la tabla. De esta manera, garantizamos que los datos estén disponibles cuando se accede a ellos en la función pintarTabla.

Comentarios

Publicar un comentario

Entradas populares de este blog

Normalizar valores

 Para asegurarte de que todos los registros en la columna juez que coinciden con "LIC. ERICK SERRANO" (y sus variantes) se cambien exactamente a "LIC. ERICK SERRANO", puedes utilizar una consulta SQL que normalice esos valores. Esto eliminará las diferencias de formato que puedan estar causando que se cuenten como registros distintos. DELETE FROM carpetas; UPDATE control SET estatus = 'TRÁMITE' ; UPDATE `carpetas` SET `juez` = ' LIC. PATRICIA LOZANO ' WHERE `juez` LIKE '% PATRICIA LOZANO %'; UPDATE `carpetas` SET `juez` = 'LIC. ERICK SERRANO' WHERE `juez` LIKE '%ERICK SERRANO%'; UPDATE `carpetas` SET `tipo_solicitud` = 'CON DETENIDO' WHERE `tipo_solicitud` LIKE '%CON DETENIDO%'; UPDATE `carpetas` SET `tipo_solicitud` = 'ORDEN DE APREHENSION' WHERE `tipo_solicitud` LIKE '%ORDEN DE APRENSION%'; UPDATE `control` SET `tipo_solicitud` = 'ORDEN DE APREHENSION' WHERE `tipo_solicitud` LIKE...
Leer más

NORMALIZAR TABLA-audiencia_intervinientes

 Para normalizar las columnas relacionadas con los intervinientes en la tabla audiencia , puedes seguir un proceso similar al que hicimos con los delitos. Vamos a crear una nueva tabla llamada audiencia_intervinientes , donde cada interviniente estará asociado a una audiencia con un tipo que indica qué rol (asistente, víctima, asesor, etc.) desempeña en esa audiencia. 1. Crear la nueva tabla audiencia_intervinientes Esta tabla contendrá una columna nombre , una columna tipo que identificará el tipo de interviniente, y una clave foránea que haga referencia a la tabla audiencia . CREATE TABLE audiencia_intervinientes (     id_interviniente INT AUTO_INCREMENT PRIMARY KEY,     id_audiencia INT NOT NULL,     nombre VARCHAR(150) NOT NULL,     tipo VARCHAR(50) NOT NULL,     FOREIGN KEY (id_audiencia) REFERENCES audiencia(id_audiencia) ON DELETE CASCADE ); 2. Insertar los intervinientes antiguos en la nueva tabla Ahora, vamos a mover los...
Leer más

Listar audiencias

  <!-- Listar Audiencias -->     <h4> Audiencias </h4>     <table class = "table" >         <thead>             <tr>                 <th> ID </th>                 <th> Folio_S </th>                 <th> Carpeta </th>                 <th> Nombre </th>                 <th> Fecha </th>                 <th> Video </th>             </tr>         </thead>         <tbody>             <?php             $audienciasCtr = new Contr...
Leer más