0

Tengo una aplicación web (JSP) en la que quiero hacer una tabla en la que el usuario indica la cantidad de filas que quiere que hayan, con un mínimo de 1 y un máximo de 32.

Para ello he hecho lo siguiente:

<div
class="clase">
<label>Cantidad Piezas</label> <input class="form-control"
type="number" min="1" max="32" id="cantidadpzs"
name="cantidadpzs" onchange="activarTabla();" value="">
</div>

Quiero aclarar que "ActivarTabla()" lo único que hace es mostrar la tabla cuando están todos los campos rellenos.

Dependiendo del valor que el usuario introduzca quiero que se muestren ese mismo número de filas

<div style="display: none" id="tablecalibredescuadre">
<div class="ibox-content">
<div class="table-responsive">
<table id="tableControlCalibreDescuadre"
class="table table-bordered table-hover table-porsa porsa-table-controlcalibredescuadre">
<thead>
<tr>
<th>ID</th>
<th>Canal</th>
<th>Plato</th>
<th>Derecha</th>
<th>Izquierda</th>
<th>Delante</th>
<th>Detrás</th>
<th>Diagonal 1</th>
<th>Diagonal 2</th>
</tr>
</thead>
<tbody>
<c:forEach begin="1" end="32" step="1"
varStatus="tagStatus">
<tr>
<td>${tagStatus.getCount()}</td>
<td contenteditable ="true"></td>
<td contenteditable ="true"></td>
<td contenteditable ="true"></td>
<td contenteditable ="true"></td>
<td contenteditable ="true"></td>
<td contenteditable ="true"></td>
<td contenteditable ="true"></td>
<td contenteditable ="true"></td>
</tr>
</c:forEach>
</tbody>
</table>
</div>
</div>

En la parte del c:foreach, debería poner el valor que ha introducido el usuario, pero no consigo hacerlo.

Me podrían ayudar?

1 respuesta 1

0

Por si a alguien le sirve de ayuda.

Al final lo he podido solucionar concatenando el código del cuerpo de la tabla en javascript:

cantidadpiezas = parseInt(document.getElementById('cantidadpzs').value);
        
document.getElementById('tablecalibredescuadre').style.display = 'block';

        var trHTML = '';

        for (i = 0; i < cantidadpiezas; i++) {
            trHTML += '<tr>';
            trHTML += '<td>';
            trHTML += i+1;
            trHTML += '</td>';
            trHTML += '<td contenteditable="true"></td>'
                    + '<td contenteditable="true"></td>'
                    + '<td contenteditable="true"></td>'
                    + '<td contenteditable="true"></td>'
                    + '<td contenteditable="true"></td>'
                    + '<td contenteditable="true"></td>'
                    + '<td contenteditable="true"></td>'
                    + '<td contenteditable="true"></td>'
                    + '</tr>'

        }
        
        $("#tableControl tbody").append(trHTML);

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.