Mostrar Aprobado o No aprobado en la nota al listar estudiantes

Cordial saludo, tengo una situacion, necesito mostrar los sigueinte: pendiente, aprobado o desaprobado al momento de listar los estudiantes en mi pagina web, los estudiantes se listan desde una consulta a un abase de datos. El inconveniente es que con el codigo que utilizo somo muestra el mensaje de pendiente, aprobado o desaprobado solo al primer registro es decir al primer estudiante del listado mostrado en la tabla.

El codigo es el siguiente, el que utilizo para mostrar los datos al listar los estdudiantes.

<table id="requestdata" width="100%" border="0" align="center" cellpadding="5" cellspacing="0"> <thead class="GrupoHeadTabla" id="TablaResultados"> <tr> <td width="90" align="center">Codigo</td> <td width="300" align="center">Asignatura</td> <td width="100" align="center">Nivel</td> <td width="100" align="center">Nota final</td> <td width="120" align="center">Estado</td> <td width="100" align="center">Acciónes</td> </tr> </thead> <tbody class="GrupoBodyTabla"> <?php require('../Conexion/conexion.php'); $consulta = $conn->prepare("SELECT * FROM tbpensumcontenido WHERE Pensum = :nombPensum"); $consulta->execute([':nombPensum'=>$pensum['idPensum']]); $resultado = $consulta->fetchAll(PDO::FETCH_ASSOC); ?> <tr> <?php if(empty($resultado)){ ?> <script> var tablaResultados = document.getElementById('TablaResultados'); var fondoResultados = document.getElementById('Resultados'); tablaResultados.style.visibility = 'hidden'; fondoResultados.style.backgroundColor = 'transparent'; </script> <div id="MensajeNohayInformacion"> Actualmente no hay asignaturas para mostrar. El estudiante no se encuentra matriculado en el programa de formación.</div> <?php } else { foreach($resultado as $CPensum){ ?> <td width="90" align="center" valign="middle"> <?php echo $CPensum['asignatura']?> </td> <td width="300" align="left" valign="middle" class="name"> <?php require('../Conexion/conexion.php'); $consultaAsig = $conn->prepare("SELECT * FROM tbasignatura WHERE codigoAsignatura = :codAsig LIMIT 1;"); $consultaAsig->execute([':codAsig'=>$CPensum['asignatura']]); $resultadoAsig = $consultaAsig->fetchAll(PDO::FETCH_ASSOC); foreach($resultadoAsig as $asignatura){ ?><?=$asignatura['nombreAsignatura']?><?php }; ?> </td> <td width="100" align="center" valign="middle"> <?php require('../Conexion/conexion.php'); $consultaNivel = $conn->prepare("SELECT * FROM tbnivelsemestre WHERE idNivelSemestre = :codNivel LIMIT 1;"); $consultaNivel->execute([':codNivel'=>$CPensum['nivel']]); $resultadoNivel = $consultaNivel->fetchAll(PDO::FETCH_ASSOC); foreach($resultadoNivel as $nivel){ ?><?=$nivel['nombreNivelSemestre']?><?php }; ?> </td> <td width="100" align="center" valign="middle"> <input type="text" name="nota" id="nota" class="inputTextoCentrado" value="<?php echo $CPensum['creditos']?>" readonly> </td> <td width="120" align="center" valign="middle"> <script>

                                            var nota = document.querySelectorAll('nota').value;
                                               
                                                       if(nota === "") {
                                                            document.write("Pendiente");
                                                        } else if(nota >= 3) {
                                                            document.write("Aprobado");
                                                        } else {
                                                            document.write("No aprobado");
                                                        } 
                                            
                                            </script>
                                        </td>
                                        <td width="100" align="center" valign="middle">
                                            <select name="asignarAsig" id="asignarAsig">
                                                <option>Matricular</option>
                                                <option>Homologar</option>
                                                <option>Habilitar</option>
                                            </select>
                                        </td>
                                    </tr>
                                    <?php
                                          };
                                        } 
                                    ?>
                                 </tbody>
                            </table>
                            
                            
El codigo javascript que utilizo para la condicion de que si la nota es vacia, o si el valor es mayor o menor de 3 que es la nota con la que se aprueba es el siguiente:
 <script>
                                                
                                            var nota = document.querySelectorAll('nota').value;
                                               
                                                       if(nota === "") {
                                                            document.write("Pendiente");
                                                        } else if(nota >= 3) {
                                                            document.write("Aprobado");
                                                        } else {
                                                            document.write("No aprobado");
                                                        } 
                                            
                                            </script>
                                    
Siendo "nota" el campo input que muestra la nota del estudiante
Nuevamente aclaro esto funciona pero solo al primner registro que se muetra de la lista de estudiantes y ese misvo valor muestra en todos los demas asi tengan como nota un valor superior de aprobacion.

Editar

Responder la pregunta

victor alfonso

2 1

Respuestas

Veo que el problema es que en el código JavaScript utiliza document.querySelectorAll('nota').value, lo cual es incorrecto porque querySelectorAll devuelve una lista de nodos, no un único valor, y además no selecciona correctaemnte los campos de nota.

Podrías intentar solucionarlo calculando el estado directamente en el servidor (sería lo ideal), sin embargo también lo puedes hacer desde JS.

Desde PHP:

<td width="120" align="center" valign="middle">
    <?php
    $nota = $CPensum['creditos'];
    if ($nota === "" || $nota === null) {
        echo "Pendiente";
    } elseif ($nota >= 3) {
        echo "Aprobado";
    } else {
        echo "No aprobado";
    }
    ?>
</td>

Con eso aseguras que cada registro muestre el estado correcto basado en la nota.

Desde JS:

Añade una clase al input que contiene las notas.

<input type="text" name="nota" class="inputTextoCentrado nota" value="<?php echo $CPensum['creditos']; ?>" readonly>

Actualiza el JS para iterar correctamente.

document.addEventListener("DOMContentLoaded", function () {
    const filas = document.querySelectorAll("tbody.GrupoBodyTabla tr");
    filas.forEach(fila => {
        const notaInput = fila.querySelector(".nota");
        const estadoCelda = fila.querySelector("td:nth-child(5)");
        const nota = parseFloat(notaInput.value);

        if (isNaN(nota) || notaInput.value === "") {
            estadoCelda.textContent = "Pendiente";
        } else if (nota >= 3) {
            estadoCelda.textContent = "Aprobado";
        } else {
            estadoCelda.textContent = "No aprobado";
        }
    });
});

Asegúrate de que la celda del estado esté vacía inicialmente.

<td width="120" align="center" valign="middle"></td>

Cualquiera de las dos podría servirte.

Adrian

Aportar una respuesta