Buenas a tod@s de la comunidad,
Me han puesto un reto: crear un paginador a punta de JQuery+HTML
Hasta el momento tengo los siguientes codigos (scripts):
1. forma.html
Código HTML:
Ver original<!DOCTYPE html>
<meta http-equiv="Last-Modified" content="0">
<input type="hidden" id="pagina" name="pagina" value"" />
<?php
for ($j=0; $j<10; $j++) {
$sec = $j+1;
?>
<td><?php echo $sec; ?></td>
<td><input type="text" id="cod<?php echo $j; ?>" name="cod
<?php echo $j; ?>" value="" size="15" />
</td>
<td><input type="text" id="nombre<?php echo $j; ?>" name="nombre
<?php echo $j; ?>" value="" size="60" />
</td>
<td><input type="text" id="cargo<?php echo $j; ?>" name="cargo
<?php echo $j; ?>" value="" size="20" />
</td>
<input type="hidden" id="sec" name="sec" value="<?php echo $sec; ?>" />
</td> <?php
}
?>
<button onClick="Paginar('Sig');" />PaginaSiguiente
<button onclick="Paginar('Ant');" />PaginaAnterior
2. paginar.js
Código Javascript
:
Ver originalvar ArrayDetalle = new FormData;
window.onload = function () {
$("#pagina").val(1);
}
function Paginar("boton") {
if (boton == "Sig") {
let pagina = $("#pagina").val();
let limite = (pagina*2);
let inicio=pagina-1;
for (var i=inicio; i<limite; i++) {
ArrayDetalle.append("detalle["+i+"][cod]", $("#cod"+i).val());
ArrayDetalle.append("detalle["+i+"][nombre]", $("#nombre"+i).val());
ArrayDetalle.append("detalle["+i+"][cargo]", $("#cargo"+i).val());
}
var i = 0;
for (var value of ArrayDetalle) {
i++;
}
for (var pair of ArrayDetalle.entries()) {
console.log(pair[0]+ ', '+ pair[1]);
}
}
}
Hasta aquí voy.
Mi idea es la siguiente: Inicialmente, una vez se complete el formulario y al hacer click sobre el botón
SiguientePagina se ejecuta la función
Paginar, en ésta empiezo a poblar el
ArrayDetalle. Hasta aquí voy al peluche....
AL hacer un
console.log de
ArrayDetalle obtengo:
Código HTML:
Ver originaldetalle[0][cod],1234
detalle[0][nombre],Pepe
detalle[0][cargo],Asistonto
detalle[1][cod],5678
detalle[1][nombre],Juancho
detalle[1][cargo],Jefe
.
.
.
etc.
Hasta acá vamos ok.
Estoy echo un lío en cómo le hago para actualizar los
id de los
input ya que, como se observa, utilizo un for de PHP para generar las 10 ocurrencias (lineas) para capturar los datos, por ejemplo:
<td><input type="text" id="cod<?php echo $j; ?>" name="cod<?php echo $j; ?>" value="" size="15" /></td> . EL valor de
$j empieza en 0 y termina en 9 para la primera página. La idea es que al pasar a la siguiente página el valor de
$j empiece en 10 y termine en 11 (de acuerdo al bucle for).
Agradezco de antemano sus comentarios y observaciones al respecto.....
Mil Gracias pues