0

tengo la siguiente función en un JSP

    <script language="javascript">
    
    function alerta() {
    var cantidad = parseFloat(document.getElementById("Stock").textContent);
    var minimo = parseFloat(document.getElementById("minStock").textContent);
    
    if (cantidad <= minimo){
        document.getElementById("Stock").style.color="#FF0000";
    }
       
}  
</script>

se supone que cuando el if sea true debería cambiar el color de cada elemento con el identificador "Stock", pero resulta que solo cambia el primer elemento de la siguiente tabla:

                   <table id="datos" number-per-page="4" current-page=""  class="table table-striped table-sm ">
                    <thead>
                        <tr>
                            <th>Id</th>
                            <th>Nombre</th>
                            <th >Descripción</th>
                            <th>Costo</th>
                            <th>Precio</th>
                            <th>Stock</th>
                            <th>Stock Mín.</th>
                            <th>Stock Máx.</th>
                            <th>Id Prov.</th>
                            <th>Id Ca.</th>
                            <th>Imagen</th>
                            <th>Actualizar / Eliminar</th>
                        </tr>
                    </thead>
                    <tbody>
                        <c:forEach var="p" items="${lista}">
                        <tr id="resConsulta">
                            
                            <td>${p.getId()}</td>
                            <td class="text-break" style="max-width: 150px;">${p.getNombre()}</td>
                            <td class="text-break" style="max-width: 150px;">${p.getDescripcion()}</td>
                            <td>${p.getPrecio_compra()}</td>
                            <td>${p.getPrecio_venta()}</td>
                            <td id="Stock">${p.getStock()}</td>
                            <td id="minStock">${p.getMin_stock()}</td>
                            <td>${p.getMax_stock()}</td>
                            <td>${p.getProveedor_idProveedor()}</td>
                            <td>${p.getCategoria()}</td>
                            <td><img src="${p.getFoto()}"width="40" height="40"></td>
                            <td>
                                <div class="btn-group " role="group " aria-label="Basic example ">
                                    <button type="button" class="btn btn-outline-warning" onclick="location.href='./Controlador?accion=EditarProducto&id=${p.getId()}'">
                                        <img src="img/icons/actualizar.png"> Actualizar
                                    </button>
                                         
                                        <button  id="deleteItem" type="button" class="btn btn-outline-danger" onclick="location.href='./Controlador?accion=EliminarProducto&id=${p.getId()}'">
                                        <img src="img/icons/eliminar.png">Eliminar
                                    </button>
                                </div>
                            </td>

                        </tr>
                        </c:forEach>

                    </tbody>
                </table>
            </div>

en el body ejecuto la función así: <body onload="alerta()"> .Alguien con mas experiencia que me pueda explicar por que sucede esto? yo apenas soy estudiante y no entiendo muchas cosas, les agradezco mucho sus respuestas

2
  • Saludos. En las páginas HTML los id deben ser únicos así sea tengas distintos o mismos tag; no te sugiero un valor que vayas incrementando y lo agregues a valor del id. Commented el 29 sept. 2020 a las 18:41
  • entiendo que el id debería ir cambiando y accedo a el a través de un for, si no estoy mal? Commented el 29 sept. 2020 a las 18:45

1 respuesta 1

2

he modificado tu alerta, primero busque todos los elementos con id Stock que puedan estar en tu tabla, luego recorro estos mismos mediante un for e inserto color a cada elemento stock de la tabla. Lo pruebas y me avisas

function alerta() {
    
    let element = document.querySelectorAll('#Stock');

    for(i=0; i<element.length ; i++)
    {
        element[i].style.color="#FF0000";
    }


}
2
  • gracias, lo estaré probando Commented el 29 sept. 2020 a las 18:55
  • efectivamente funciono, si accede a cada elemento con el Id Stock, muchas gracias. veré como lo modifico para que funcione la comparación que necesito Commented el 29 sept. 2020 a las 18:58

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.