No puedo serializar formularios en una misma página

nh2006 · #1 (**permalink**) 10/10/2011, 11:37

Bien amigos, como ya les dice el tema, no entiendo por qué la función serialize(); no me funciona a la hora de serializar los campos de los formularios, comentarles que tengo una aplicación donde tengo muchos formularios es una página, algunos de estos son generados dinámicamente, por lo tanto, para no alargar el texto de este hilo, he preparado un pequeño ejemplo con 2 formularios y 2 campos cada uno:

El código es el siguiente:

Código HTML:

Ver original<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <title>Multiples formularios</title>        
        <script src="http://code.jquery.com/jquery-latest.js" type="text/javascript" charset="utf-8"></script>
        <script type="text/javascript" charset="utf-8"> 
        $(document).ready(function(){
            $(".registrar").click(function() {              
                var $this = $(this);
                var $parent = $this.parent();
                alert($parent.attr("id"));
                var cadena = $parent.serialize();
                alert("Los datos a enviar son: "+cadena);
            });     
        });     
        </script>
    </head>
    <body>
        <form class="formularios" id="formulario1">
            <label for="nombre">Su nombre:</label>
                <input type="text" id="nombre" /><br />
            <label for="edad">Edad:</label>
                <input type="text" id="edad" /><br />
            <input type="button" value="registrar" class="registrar" id="btn1" />
        </form>
        <form class="formularios" id="formulario2">
            <label for="nombre">Ocupacion:</label>
                <input type="text" id="ocupacion" /><br />
            <label for="edad">Fecha:</label>
                <input type="text" id="fecha" /><br />
            <input type="button" value="registrar" class="registrar" id="btn2"/>
        </form>
    </body>
</html>

La idea es que si tengo muchos formularios agrupados por una clase, tengo que saber desde cuán formulario se ha dado clic (por eso ocupo parent()), un vez obtenido el formulario desde el cual se ha dado clic lo que quiero hacer es serializarlo para procesarlo en otra página posterirormente, lo que no me explico es por qué no me la función serialize().

¿Podrían hacerme el favor de ayudarme con esto?.

Muchas gracias desde ya.

Saludos