<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript">
$(document).ready(function(){ /**
* Funcion para añadir una nueva fila en la tabla
*/
$("#add").click(function(){ var nuevaFila="<tr> \
<td><input type='text' name='nombre[]'></td> \
<td><input type='text' name='apellido[]'></td> \
<td><input type='button' class='del' value='Eliminar Fila'></td> \
</tr>";
$("#tabla tbody").append(nuevaFila); });
// evento para eliminar la fila
$("#tabla").on("click", ".del", function(){ $(this).parents("tr").remove(); });
});
</script>
</head>
<body>
<?php
if(isset($_POST["nombre"]))
{ // Si se envian los datos, los mostramos...
echo "<pre>";
var_dump($_POST);
echo "</pre>";
}
?>
<p>
<form action="<?php echo $_SERVER["PHP_SELF"]?>" method="post">
<table id="tabla" border=1>
<thead>
<tr>
<th>Nombre</th>
<th>Apellidos</th>
<th><input type="button" id="add" value="añadir fila"></th>
</tr>
</thead>
<tbody>
<tr>
<td><input type="text" name='nombre[]'></td>
<td><input type="text" name='apellido[]'></td>
<td><input type='button' class='del' value='Eliminar Fila'></td>
</tr>
</tbody>
</table>
<input type="submit" value="enviar">
</form>
</p>
</body>
</html>
Crear cuenta
Comentarios sobre la versión: Versión 1.0 (3)