como modificar algo en la pagina sin necesidad de redireccionamiento

[juanmvilla]

A ver si me puedo explicar bien:
necesito encontrar la forma de que al hacer click en un boton que diga "agregar mas", se abra una seccion nueva donde cargar ciertos datos, pero sin que me redireccione. es decir que debajo de ese lugar se genere una nueva seccion de la pagina

[jaxa]

Eso lo puedes hacer poniendo en un div lo que quieras que aparesca y poniendo el atbiuto visibility como hidden despues con un evento de javascript al dar click en el boton que cambie el atributo a visible. no se si hay alguna forma mejor yo siempre que lo necesito hago eso

PD: Creo que esto deberia ir en javascript no?

[juanmvilla]

no sabia que era javascript, ni se manejarlo :P pero me das una mano?
como haces?
gracias, disculpa

[jaxa]

Código HTML:

<BUTTON onclick="document.getElementById('id_de_tu_div').style.visibility = 'visible'">
Agregar Mas
</BUTTON>

<div id="id_de_tu_div" style="visibility: hidden;">
Lo que quieres que aparesca 
</div> 

No se que propiedad es mejor usar visibility o display... yo siempre uso visibility pero si quieres esperar a que alguien que sepa mas te diga

[juanmvilla]

muchas gracias che :D

[juanmvilla]

me queda en hidden, es decir, no aparece nada

[arepavieja]

Puedes usar esta función:

Código Javascript:

<script type="text/javascript">
      emails=0;
      function agregar() {
      emails=emails+1;
     $("#campos").append('<tr class="email'+emails+'"><td><input type="text" name="mail[]" /></td> <td><a href="#" onclick="javascript:borrar('+emails+');">Borrar</a></td></tr>');
      }
      function borrar(cual) {
          $("tr.email"+cual).remove();
          return false;
      }
  </script>
 

y en el formulario: (Debes descargar el jquery y llamarlo.)

Código HTML:

<script type="text/javascript" src="jquery.js"></script>
 
<table id="campos">
<tr>
<td><input type="text" name="mail[]" /></td>
<td><input type="hidden" name="email[]" id="email" /></td>
<td><input type="button" value="Agregar"  onclick="javascript:agregar();"/></td>
</tr>
</table>
 

[juanmvilla]

no funciona, por otra parte, me explicas que hace esta linea:
$("#campos").append('<tr class="email'+emails+'"><td><input type="text" name="mail[]" /></td> <td><a href="#" onclick="javascript:borrar('+emails+');">Borrar</a></td></tr>');
}
muchas gracias :D
perdon, ya se que no va en este foro, bueno... ahora lo se