¿Cómo puedo agregar dinámicamente campos de entrada a un formulario?

No soy muy programador web, pero estoy creando una aplicación web simple que tiene una forma en la que el usuario puede ingresar una serie de puntos (x, y, z) pero no sé cuántos el usuario va a ingresar No quiero adivinar el máximo probable (¿100 tal vez?) Y poner 100 campos en el formulario porque se vería feo. ¿Cuál es la forma más fácil de agregar más campos (o mostrar los campos) a medida que el usuario ingresa datos sin contactar al servidor?¿Cómo puedo agregar dinámicamente campos de entrada a un formulario?

Actualmente estoy utilizando html & php, pero supongo que para hacer esto, ¿necesitaré javascript?

Actualmente mi código es así, cuando el usuario ingresa datos, quiero que aparezca otra fila.

<form action="edit.php" method="post"> 
    <table border=1> 
    <tr> 
     <td> 
     <td>X 
     <td>Y 
     <td>Z 
    </tr> 
    <tr> 
     <td>1</td> 
     <td><input type=text name=x1 size=10 value="0.4318"></td> 
     <td><input type=text name=y1 size=10 value="0.0000"></td> 
     <td><input type=text name=z1 size=10 value="0.1842"></td> 
    </tr> 
    <tr> 
     <td>2</td> 
     <td><input type=text name=x2 size=10 value="0.4318"></td> 
     <td><input type=text name=y2 size=10 value="0.0000"></td> 
     <td><input type=text name=z2 size=10 value="-0.1842"></td> 
    </tr> 
    <tr> 
     <td>3</td> 
     <td><input type=text name=x3 size=10 value="-0.3556"></td> 
     <td><input type=text name=y3 size=10 value="0.0000"></td> 
     <td><input type=text name=z3 size=10 value="0.1636"></td> 
    </tr> 
    ... I want more to appear here... 
    </table> 
    <button name="submit" value="submit" type="submit">Save</button> 
</form>

¿Alguna idea de la manera más fácil? Gracias ...

Fuente

2009-08-14 Roland Rabien

me gustaría utilizar jQuery y append las nuevas entradas.

Fuente

2009-08-14 18:55:17 jjclarkson

Funciona muy bien, gracias. –

Lo más probable es que tengas que usar javascript, sí. Puede utilizar este o danos tu usarlo como referencia:

http://www.mredkj.com/tutorials/tableaddrow.html

Fuente

2009-08-14 18:53:59 cakeforcerberus

Lo que dices es que estás escribiendo las etiquetas de entrada a mano? ¿O está diciendo que desea una acción dinámica en la que un usuario haga clic en un botón y agregue más filas en la tabla?

En cualquier caso, para su código, solo necesita un bucle, como ese. Asumo $ de datos es cualquier dato que desea establecer en base a una matriz que es probablemente a partir de la base de datos o algo:

<?php 
for($i=0, $iMaxSize=count($data); $i<$iMaxSize; $i++) 
{ 
?> 
<tr> 
    <td><?= $i+1 ?></td> 
    <td><input type=text name=x1 size=10 value="<?=$data[$i]['something']"></td> 
    <td><input type=text name=y1 size=10 value="<?=$data[$i]['somethingelse']"></td> 
    <td><input type=text name=z1 size=10 value="<?=$data[$i]['somethingelseagain']"></td> 
</tr> 
<?php 
} // end for 
?>

Por supuesto que no se puede copiar y pegar lo anterior, pero eso es un buen punto de partida.

Para hacerlo dinámicamente, no puede usar php. Lo que parece que quieres usar es javascript ajax y la combinación php.

Fuente

2009-08-14 20:21:30 Daniel

Quiero hacerlo de forma dinámica. –

Creé algo similar y creo que podría ayudarte. Usé jQuery para crear campos de entrada de forma dinámica. Por favor, consulte este enlace: Dynamically add form fields

Fuente

2013-06-26 10:07:46 Sanjeev

Añade algo de HTML a todos los párrafos.

<!DOCTYPE html> 
<html> 
<head> 
    <style> 
    p { background:yellow; } 
</style> 
    <script src="http://code.jquery.com/jquery-1.9.1.js"></script> 
</head> 
<body> 
    <p>I would like to say: </p> 
<script> 
    $("p").append("<strong>Hello</`enter code here`strong>"); 
</script> 

</body> 
</html>

Fuente

2013-06-26 10:24:04

¿Cómo puedo agregar dinámicamente campos de entrada a un formulario?

Respuesta

Cuestiones relacionadas