Recorrer todos los objetos de un formulario con JQuery

Hasta el momento, todo lo que he trabajado con JQuery son ventajas y esta, es otra de esas facilidades que ofrece. Vamos a recorrer todos los objetos de un formulario y vamos a añadirle algunas opciones más como validadores y demás.

Todo esto viene por que estamos trabajando en un editor “editable” en JQuery, es decir un CMS que se adapte a nuestras necesidades, creando un formulario con el número y tipo de objetos para crear al vuelo y que luego puedan ser interpretados para generar en muy poco tiempo el CMS ajustado. No voy a entrar a explicar más en profundidad ya que el artículo va sobre otro tema, pero si tenéis interés podéis preguntar por Dk Web v2 😉

Volviendo al “tejemaneje” de cómo recorrer los objetos de un formulario, os pego el código de ejemplo como siempre y luego paso a comentarlo:

$(form).find(‘:input’).each(function() { //esta es la función que hace que recorrar todos los “form” que haya en nuestro documento

this.id = this.name; //el nombre del objeto lo asigno al id (esto es así por como genero el formulario pero se podría omitir)

switch (this.name.substr(0, this.name.indexOf(‘_’)))
{
case “imagen”:
$(this).after(‘<input type=”button” name=”Submit” value=”+” onclick=”VentanaPopup(\’./filemanager/index.php?campo=’+this.name+’\’)” />’);
break;
}

});

Como veréis es bastante sencillo, simplemente utilizo la función o método each para recorrer todo el “array” de objetos de la etiqueta <form>. El resto que he dejado es simplemente para que veáis como ejemplo lo que se puede llegar a hacer. En mi caso, pregunto si el tipo de objeto que he nombrado con anterioridad imagen_ para añadir en este caso un botón que llamará a una ventana emergente con la que gestionar las imágenes. Este botón se añade con la función after que hablamos en otro artículo. De igual manera, se podrán crear los eventos para validar el tipo de campo, cambiar de colores, etc… Yo os dejo la herramienta y la idea, vosotros la utilizáis como queráis.

Como comentaba, al crear un editor “al vuelo”, los objetos los nombro con “imagen_” o “texto_” o “email_” etc, para luego ir dándole propiedades a estos objetos. Fácil y sencillo.

Si tenéis cualquier duda podéis comentarla 😉