añadir cajas de texto dinamicamente

[zerokull]

hola que tal a todos tengo el siguiente problema

haber si me dicen por donde empeza:

Lo que quiero hacer es lo siguiente tener un formulario con 2 cajas de texto y poner un link o boton que diga agregar mas cajas cada de que apriete el link o boton que me agrege una caja mas.

espero y me puedan ayudar

[Triby]

Eso se hace con javascript, no con PHP... voy a reportar el mensaje para que lo muevan a la seccion adecuada: http://www.forosdelweb.com/f13/

[jam1138]

Tema movido desde PHP

[bebo]

Prueba con este cosigo:

Código:

<script>
var cajas=2;
function agregar_caja(){
document.getElementById("cajas").innerHTML+="Caja "+new Number(cajas+1)+": <input type=text name='caja"+new String(cajas+1)+"'><br>"
cajas=cajas+1
}</script>
<div id="cajas">Caja 1: <input type=text name=caja1><br>Caja 2: <input type=text name=caja2><br></div>
<input type=button onclick="agregar_caja()" value="Agregar caja">

[catal]

Hola ha zerokull no se si le ha servido, pero a mi si.

Solo quisiera que alguien me comentara la funcion del document.get......
A parte, de el comentario me surge una duda, si tengo que insertar todo este codigo,

Código HTML:

<div id="1">
  <form id="form1" name="form1" method="post" action="">
    <label>
      <select name="select" id="select">
        <option value="null">Elije un valor</option>
        <option value="null">....</option>
        <option value="1">1</option>
        <option value="2">2</option>
        <option value="3">3</option>
      </select>
    </label>
    <label>
      <select name="select" id="select">
        <option value="null">Elije un valor</option>
        <option value="null">....</option>
        <option value="1">1</option>
        <option value="2">2</option>
        <option value="3">3</option>
      </select>
      <input type="submit" name="button" id="button" value="Submit" />
    </label>
  </form>
</div> 

como lo hariais, creado una variable javascript con todo el codigo en el interior o .....

[zerokull]

ok funciono de maravilla pero como identifico el nombre de la caja que se agrego para insertar ese dato en mysql con php

[bebo]

Crea un formulario apuntando a tu página php:

Código:

<script>
var cajas=2;
function agregar_caja(){
document.getElementById("cajas").innerHTML+="Caja "+new Number(cajas+1)+": <input type=text name='caja"+new String(cajas+1)+"'><br>"
cajas=cajas+1
}</script>
<form action="tu pagina.php" method=post>
<div id="cajas">Caja 1: <input type=text name=caja1><br>Caja 2: <input type=text name=caja2><br></div>
<input type=button onclick="agregar_caja()" value="Agregar caja"><br>
<input type=submit value="Enviar"></form> 

Y en la página php, cuentas las cajas enviadas y las insertas en la base de datos.

[zerokull]

pero para capturar el valor por medio de post seria algo asi
$caja1=$_POST['caja1'];
$caja2=$_POST['caja2'];
$cajas=$_POST['cajas'];

[zerokull]

y otra pregunta cuandio escribo en las cajas y decido agregar otra mas el contenido escrito dentro de las cajas se borra como le ago para que no se borre el contenido ya escrito

[bebo]

Con éste codigo no se borra lo ya escrito:

Código html:

<script>
var cajas=2;
function agregar_caja(){var valores=new Array();var contenido=""
 
for(i=1;i<=cajas;i++){//Obtenemos el valor de las cajas
valores[i]=eval("document.form.caja"+i.toString()+".value");
}
cajas=cajas+1
for(i in valores){
contenido+="Caja "+i.toString()+": <input type=text name='caja"+i.toString()+"' value='"+valores[i]+"'><br>"
}
contenido+="Caja "+cajas.toString()+": <input type=text name='caja"+cajas.toString()+"'><br>";
document.getElementById("cajas").innerHTML=contenido;
 
 
}</script>
<form action="tu pagina.php" method=post name=form>
<div id="cajas">Caja 1: <input type=text name=caja1><br>Caja 2: <input type=text name=caja2><br></div>
<input type=button onclick="agregar_caja()" value="Agregar caja"><br>
<input type=submit value=Enviar></form>
 

[zerokull]

mira mi idea es la siguiente ya hice ese programa pero de manera diferente lo que hice fue lo siguiete

para e,pezar es un una pagina que le permita al usuario ingresar el numero de experiencias laborales, tenia una caja de texto donde el onia el numero una vez introducido le arrojaba el total de experiencias labores y este es el codigo que utilize

<form action="#" method="post" name="formular" class="formular" id="formular" onSubmit="return validar(this)">


<p>&nbsp;</p>
<table width="100%" border="0">
<tr>
<td width="36%">Numero de experiencias laborales a capturar.*
<input name="total_de_cajas" type="text" class="validate['required','digit[1,7]'] text-input-TelMovil"/></td>
<td width="64%"><input name="AgregarCajas" type="submit" id="AgregarCajas" value="Ir" /></td>
</tr>
</table>
<p>&nbsp;</p>
<p><?
if(isset($_POST['AgregarCajas'])){ ?>
<script>
document.formular.AgregarCajas.disabled=true;
document.formular.total_de_cajas.disabled=true;
</script>
<?
for($i=1;$i<=$total_de_cajas;$i++){?>
<table>
<td colspan="15" bgcolor="#666666"><center>
<font color="#FFFFFF">Experiencia actual o ultima </font>
</center></td>
</tr>
<tr>
<td width="98" align="right" class="Estilo3"><label> </label>
<div align="right">Empresa actual o ultima:<span class="Estilo5">*</span></div></td>
<td width="54" class="Estilo3"><input name="empresaactual[<?php echo $i; ?>]" type="text" class="validate['required'] text-input-TelMovil" id="empresaactual" size="40" onkeyup="validar(this)"/></td>
<td width="64" align="right" class="Estilo3">Jefe directo :<span class="Estilo5">*</span> </td>
<td colspan="2" class="Estilo3"><input name="jefe1[<?php echo $i; ?>]" type="text" class="validate['required'] text-input-TelMovil" id="jefe1[<?php echo $i; ?>]" size="20" onkeyup="validar(this)"/></td>
<td width="56" align="right" class="Estilo3">Puesto jefe:<span class="Estilo5">*</span> </td>
<td width="128" class="Estilo3"><input name="puesto[<?php echo $i; ?>]" type="text" class="validate['required'] text-input-TelMovil" id="puesto[<?php echo $i; ?>]" size="20" onkeyup="validar(this)"/></td>
</tr>
<tr>
<td align="right" class="Estilo3"><label> </label>
<div align="right">Puesto:<span class="Estilo5">*</span> </div>
<label> </label></td>
<td class="Estilo3"><input type="text" class="validate['required'] text-input-TelMovil" name="puesto2[<?php echo $i; ?>]" id="puesto2[<?php echo $i; ?>]" onkeyup="validar(this)" value=""/></td>
<td align="right" class="Estilo3">Telefon+Lada:<span class="Estilo5">*</span> </td>
<td width="52" class="Estilo3"><input name="lada[<?php echo $i; ?>]" type="text" class="validate['required','length[2,3]','digit'] text-input-TelMovil" id="lada[<?php echo $i; ?>]" value=""/></td>
<td width="52" class="Estilo3"><input name="telefono[<?php echo $i; ?>]" type="text" class="validate['required','length[8,-1]','digit'] text-input-TelMovil" id="telefono[<?php echo $i; ?>]" maxlength="8" value=""/></td>
<td align="right" class="Estilo3">Actividades:<span class="Estilo5">*</span> </td>
<td class="Estilo3"><textarea name="actividsades[<?php echo $i; ?>]" cols="50" class="validate['required'] text-input" id="actividsades[<?php echo $i; ?>]"></textarea></td>
</tr>
</table>
<?php }?>
<input type="submit" value="Guardar Datos"/>
<input type="text" value="<?php echo $i-1; //dato que ems irve para saber cuantas filas tendra el array ?>" name="cantidad" />
</form>

<? }
$cantidad=$_REQUEST['cantidad']; //cantidad de filas que tiene mi array variable que viene del formulario

$datos=array(A=>$_POST['empresaactual'],B=>$_POST['jefe1'],C=>$_POST['puesto'],D=>$_POST['puesto2'],E=>$_POST['lada'],F=>$_POST['telefono'],G=>$_POST['actividsades']);//creo el array $datos
//recorro el array con for deberia ser con foreach pero no he probado si alguien sabe por favor agregar

for($i=1;$i<=$cantidad;$i++)
{
// if($datos['empresaactual'][$i]!="" and $datos['jefe1'][$i]!="" and $datos['puesto'][$i]!="" and $datos['puesto2'][$i]!="" and $datos['lada'][$i]!="" and $datos['telefono'][$i]!="" and $datos['actividsades'][$i]!=""){// si una fila no tiene datos, no recupero

// listo los datos del array

$uno=$datos['A'][$i];
$dos=$datos['B'][$i];
$tres=$datos['C'][$i];
$cuatro=$datos['D'][$i].$datos['E'][$i];
$cinco=$datos['F'][$i];
$seis=$datos['G'][$i];
$insertar=mysql_query("INSERT INTO datosprofecionales(email,empresaactual,puesto,jefe 1,puesto2,telefono,actividsades) values('$id','$uno','$dos','$tres','$cuatro','$cin co','$seis')")or die(mysql_error()); ?>

pero lo que me pidieron fue que al dar un click en un link o un boton se vallan insertando conforme le den click al boton o al enlace

[zerokull]

o como puedo adaptar el codigo de bebo para meter los valores en mysql con php ya he tratado y no se como por favor ayuda estoy muy desesperado

[zerokull]

como puedo imprimir el contenido de las cajas en la misma pagina

[zerokull]

o como puedo saber cualtas cajas hay lo estoy haciendo con un for pero no sale

<?
for($j=1;$j<=5;$j++)
echo $caja[$j];?>

[zerokull]

hola alparecer ya encontre un codigo que se adapta amis necesidades pero el problema es que no se mucho de javascript
lespongo el URL para que vean que es lo que quiero y mi pregunta es que si en base a ese codigo me pudieran ayudar para enviar todas las variables de las cajas de texto a mysql con php

URL: http://demo.jorgeivanmeza.com/MooToo.../0.2/demo.html
espero haberme explicado

[kazukyx5]

Iniciado por zerokull

Me sirvio

URL: http://demo.jorgeivanmeza.com/MooToo.../0.2/demo.html