Hola amigos, la verdad es que soy nuevo en esto, me pidieron hacer un reporte en el cual, yo tengo un campo de texto junto con un boton, cada vez que le aprieto al boton se agrega otro campo de texto con otro boton. Mi problema es, como hago para que al apretar el boton de cualquier renglon se agregue otro campo de texto con su boton, exactamente debajo del que le aprete. ¿¿Me explico?? No quiero que se agregue hasta el final.
este es mi codigo js
Código:
function crearNivel(nvo,proc,K,J,L,M)
{
K++;
i++;
J=0;
L=0;
aux = "";
aux += "<div id=\"campos_"+i+"\">";
aux += "<table>";
aux += "<tr>";
aux += "<td><input type=\"button\" id=\"mas"+K+"\" name=\"mas\" onclick=\"crearNivel('nuevo','nvo','"+K+"','"+J+"','"+L+"','"+M+"')\" value=\"+\"></td>";
aux += "<td><input type=\"button\" id=\"nivel"+K+"\" name=\"nivel\" onclick=\"crearNivel('bajar','sub','"+K+"','"+J+"','"+L+"','"+M+"')\" value=\">\"></td>";
aux += "<td colspan=2> </td>";
aux += "<td><input type=\"text\" id=\"txtcarpeta"+K+"\" name=\"txtcarpeta"+K+"\" value=\"Escribir nombre de carpeta\" onfocus=\"brrtxt(this.id)\" onkeypress=\"return parse(event)\" onblur=\"checktxt(this.id) \"> ";
aux += "<td colspan=2> </td>";
aux += "<td><select id=\"select"+K+"\" name=\"select"+K+"\" style=\"display:none\"><option value=\"-\">-</option><?echo $option;?></select>"
aux += "</tr>";
aux += "</table>";
aux += "</div>";
document.getElementById('tabla1').innerHTML += aux;
document.getElementById('a').value = K
document.getElementById('b').value = J
document.getElementById('c').value = L
document.getElementById('d').value = M
}
}
}
y esto es lo que tengo en HTML
Código HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
<link href="../carpetas/estilos.css" rel="stylesheet" type="text/css" media="screen" />
<link href="../carpetas/default.css" rel="stylesheet" type="text/css" media="screen" />
<script type="text/javascript" src="./confArbol.js"></script>
<?php $xajax->printJavascript(); ?>
</head>
<body>
<form name="principal" method="post">
<input type="hidden" id="option" name="option" value="<?php echo $option;?>">
<input type="hidden" id="identi" name="identi" value="<?php echo $a;?>">
<input type="hidden" id="selec" name="selec" value="<?php echo $b;?>">
<input type="hidden" id="url" name="url" value="<?php echo $c;?>">
<input type="hidden" id="a" name="a" value=0>
<input type="hidden" id="b" name="b" value=0>
<input type="hidden" id="c" name="c" value=0>
<input type="hidden" id="d" name="d" value=0>
<table id="tgrisimg" align=center width=100%>
<!--th> DOCUMENTACION GENERAL DEL PROYECTO</th-->
<TD> CONFIGURACION DE ARBOL DE ARCHIVOS </TD>
</table>
</br>
</br>
<table align="right" width=100%>
<TD align="right">
<input type="button" id="btnLimpiar" name="btnLimpiar" onClick="limpiar()" value="Limpiar" >
<input type="button" id="btnguardar" name="btnguardar" onclick="xajax_guardar(xajax.getFormValues('principal', 1))" value="Guardar">
</TD>
</table>
<BR/>
<HR>
<BR/>
<div id="mensaje">
<table align=center width=95%>
<tr>
<td id='tdmensaje' class='CeldaSola' value="HOLA" style='text-align:center; width:100%;'></td>
</tr>
</table>
</div>
<div id="tabla1">
<table>
<tr>
<td><input type="button" id="mas" name="mas" onclick="crearNivel('nuevo','',0,0,0,0)" value="+"></td>
<td><input type="button" id="nivel" name="mas" disabled="true" value=">" ></td>
<td colspan=2> </td>
<td><input type="text" id="txtcarpeta0" name="txtcarpeta0" value="Escribir nombre de carpeta" onfocus="brrtxt(this.id)" onkeypress="return parse(event)" onblur="checktxt(this.id) " >
<td><select id="select0" name="select0" style="display:none"><option>-</option><?echo $option;?></select>
</tr>
</table>
</div>
</form>
</html> espero su ayuda ya que es urgente! =S Gracias de antemano