Comunidad de diseño web y desarrollo en internet online

AYUDA: duplicar capa

Citar            
MensajeEscrito el 27 Ago 2009 10:31 pm
hola, estoy realizando un sistema el cual necesita que un grupo de inputs se dupliquen.
me explico,
hay un formulario donde hay 3 inputs los cuales necesitan ser duplicados porque no se puede determinar cuantos datos valla a ingresar el usuario, o si no va a ingresar ninguno.

Espero su pronta respuesta.

Por sebas_burgos

15 de clabLevel



Genero:Masculino  

Desarrollador en Papaya.pe

msie8
Citar            
MensajeEscrito el 05 Sep 2009 10:17 pm
Hola Sebas, si entendí bien tu pregunta creo que puedes hacerlo muy facilmente con la librería JQuery, de hecho yo tuve la misma necesidad y con esta libreria pude hacerlo facilmente. Bueno te explico como es mi solución y tu ves si te sirve o no. Mi idea es mostrar al cargar la pagina por lo menos un input y un enlace con una imagen para agregar más inputs en caso de que el usuario los necesite, además del hecho que cuando creo un input dinamicamente a este le agrego un vinculo para poder eliminarlo tambíen.
Bueno te pongo algo de código:

Código HTML :

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>
<head>
<title>Cargar Pel&iacute;cula</title>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1"/>
<script type="text/javascript" src="./includes/jquery-1.3.2.js"></script>
<script type="text/javascript">
<!--

var num_productoras = 1;
   
function init() {
        //Esta es la funcion que te permitirá crear dinamicamente los inputs
   function crearNodo() {
      $("<div id=\"cont"+num_productoras+"\" style=\"float:left;\"><label for=\"producer"+num_productoras+"\">Productora "+num_productoras+":</label><input type=\"text\" name=\"productoras[]\" id=\"productora"+num_productoras+"\"/>").appendTo("#productoras");
      
      $("<a href=\"#\"><img src=\"./images/delete.png\" style=\"border:none;\" alt=\"Eliminar\" title=\"Eliminar\"/></a>").css("float","left").appendTo("#cont"+num_productoras).click(function() {
                        //funcion que se encarga de eliminar el ultimo input + label creado
         $("#productoras > div:last").remove();
         num_productoras--;
      });
   
        //al cargar la pagina creo por lo menos un input
   crearNodo();
   $("#addProd").click(crearNodo);
}

$(document).ready(init);
-->
</script>
<body>
<!-- ESTE ES UN RESUMEN DE LA PARTE QUE IMPORTA DE MI FORMULARIO -->
<fieldset style="margin:0;" id="productoras"> 
 <legend>
  <a href="#" title="Agregar" id="addProd"><img src="./images/add.png" alt="Agregar" title="Agregar" style="border:none;margin-left: 4px;"></a>Productora(s):
 </legend>
</fieldset>
</body>
</html>


Este código lo escribí hace poco, pero anda, aunque quiza pueda ser optimizado mas.
Espero te sirva o puedas adaptarlo a tu problema y me cuentas que tal te fue.
Saludos

Por bucle_infinito

Claber

166 de clabLevel

1 tutorial

 

.NET Developer

firefox
Citar            
MensajeEscrito el 07 Sep 2009 10:01 pm
Gracias, pero no me corre =/

Por sebas_burgos

15 de clabLevel



Genero:Masculino  

Desarrollador en Papaya.pe

firefox
Citar            
MensajeEscrito el 25 Sep 2009 03:42 am
Hola de nuevo sebas, disculpas por no contestar antes pero estaba lejos de las computadoras. Te cuento que ese script me funciona a la perfeccion, de hecho lo estoy utilizando actualmente.
Ahora se me ocurre que tu problema podria estar en que si hiciste un copy-paste del codigo al correrlo en tu maquina no encuentre donde esta la libreria jquery (claro que antes deberias de haberla descargado) ya que en el script que postee en la parte del <head> inmediatamente despues de la etiqueta <meta> estoy incluyendo la libreria JQuery, pero si te fijas en la ruta, src, dice ./includes/jquery-1.3.2.js, tu deberias cambiar esta ruta por la ubicacion donde reside la libreria dentro del directorio que aloja tu pagina web, es decir src="ruta donde colocaste JQuery".
Prueba esto y luego me cuentas.
Saludos

Por bucle_infinito

Claber

166 de clabLevel

1 tutorial

 

.NET Developer

firefox

 

Cristalab BabyBlue v4 + V4 © 2011 Cristalab
Powered by ClabEngines v4, HTML5, love and ponies.