clonar campos y cambiar atributos y agregar contenido

edgardoll4 · #1 (**permalink**) 30/03/2011, 20:05

buenas.. tengo un problema con clonar unos campos..

codigo javascript jquery

Código:

var mate_inscribir= 1;
	
	function agregar_materia_inscribir(){
		mate_inscribir++;
		$("#1").clone(true).attr('id',mate_inscribir).append('<a href="#" onclick ="javascript:borrar_campos('+mate_inscribir+')" > Borrar </a>').appendTO("#materias_inscribir");
		return false;
	};

codigo html

Código HTML:

<fieldset id="materias_inscribir_fieldset">
<legend>Materias a Inscribir</legend>
<ul id="materias_inscribir">
<li id="1">
<select name="cod_materia[]"> 
<select name="cod_materia[]"> 
<option value="1"/> 541140-Taller de Lengua I
<option value="2"/> 540701-Historia de la Educacion
<option value="3/">.... la lista es muy larga asi que la acorte
</select>
<input type="hidden" name="modificacion" value="1" />
<select name="razon_solicitud[]"> 
<option value="1"/> Dis= Dispersi&oacute;n
<option value="2"/> Ch= Choque de hora
<option value="3"/> Pr= Prelaci&oacute;n
<option value="4"/> Ex= Exeso de hora
</select><br />
</li>
</ul>
<a href="javascript:agregar_materia_inscribir();">Agregar materia</a>
</fieldset>

<input type="submit" name"submit" value="Registrar"/>
saben tambien como puedo poner en los campos a agregar antes de la etiqueta "</li>" ej "<a href"#" oncline javascript:borrar(mate_inscribir)> Borrar </a>

de ante mano le agradezco su ayuda

caricatos · #2 (**permalink**) 31/03/2011, 00:19

Tema movido desde javascript

Con javascript normal es fácil de solucionar tu problema, per tratándose de una librería, espero que te sepan ayudar. Por cierto, los id no pueden empezar con un número...

Saludos

edgardoll4 · #3 (**permalink**) 31/03/2011, 07:25

mmm tome su sugerencia de los id pero aun nada!! :( como seria con javascript puro?? tambien corregui el "appeTo"

Dany_s · #4 (**permalink**) 01/04/2011, 06:25

para agregar el "borrar" antes del li puedes agregar al html y borrar al ingresar para que no para que no aparezca en el primer item pero antes obtener el html del li para luego poder agregar

Código HTML:

Ver original<html>
    <head>
        <title>Ejemplo</title>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.0/jquery.min.js"></script>
        <script>
 
        $(function(){
 
            fila = $("#materias_inscribir").html();
            $("#materias_inscribir .borrarMateria").remove();
 
            $("#agregarMateria").click(function(){
                $("#materias_inscribir").append( fila );
            });
 
            $(".borrarMateria").live('click', function(){
                $(this).closest('li').remove();
            });
 
            $('form').submit( function(){
                alert($(this).serialize());
                return false;
            });
 
        });
 
        </script>
    </head>
    <body>
    <form>
        <fieldset id="materias_inscribir_fieldset">
            <legend>Materias a Inscribir</legend>
            <ul id="materias_inscribir">
                <li>
                    <select name="cod_materia[]">
                        <option value="1"/> 541140-Taller de Lengua I
                        <option value="2"/> 540701-Historia de la Educacion
                    </select>
                    <select name="razon_solicitud[]">
                        <option value="1"/> Dis= Dispersi&oacute;n
                        <option value="2"/> Ch= Choque de hora
                        <option value="3"/> Pr= Prelaci&oacute;n
                        <option value="4"/> Ex= Exeso de hora
                    </select>
                    <a href="#" class="borrarMateria">Borrar materia</a>
                </li>
            </ul>
            <a href="#" id="agregarMateria">Agregar materia</a>
        </fieldset>
 
        <input type="submit" value="Registrar"/>
    </form>
    </body>
</html>