Javascript : Recorrer elementos de un formulario.

Marzo 10th, 2008 by kenavik

Función para recorrer los elementos de un formulario y sus propiedades con Javascript cliente.
Este es un simple ejemplo en el que podemos ver las propiedades NAME,TYPE y VALUE. (existen muchas más)
Para ello usaremos la colección elements que nos proporcionara todos los nodos del documento.
Usando la propiedad document.frm.elements.length podremos saber el número de items y así recorrer todos los elementos del documento HTML


<script>
function RecorrerForm(){
var sStr = "";
var frm=document.frm;
for (i=0;i<document.frm.elements.length;i++)
{
sAux += "NOMBRE: " + frm.elements[i].name;
sAux += “TIPO : ” + frm.elements[i].type;
sAux += “VALOR: ” + frm.elements[i].value + “\n” ;
}
alert(sStr);
}
</script>


<form name="frm">
<input type="text" value="" name="nombre"><br>
<input type="text" value="" name="apellidos"><br>
<input type="text" value="" name="telefono"><br>
<input type="text" value="" name="ciudad"><br>
<input type="text" value="" name="pais"><br>
<input type="submit" value="Aceptar" onclick="javascript:RecorrerForm();" >
</form>

Posiblemente este ejemplo no tenga mucha útilidad pero es una pequeña muestra de la potencia de javascript al recorrer la jerarquia de NODOS de un documento HTML.

Posted in Javascript |

5 Responses

  1. Eva Says:

    Hola!
    Por favor, podrías enviarme un mail, explicándome cómo puedo descubrir quién me llama con número oculto.Un saludo y gracias de antemano. evamaespa@hotmail.com

  2. Marc Says:

    No sería mejor instanciar el formulario usando un ID? utilizando DOM

    var frm = document.getElementById(”myform”);

    Creo que sería mas versatil si tenemos en cuenta las versiones de los navegadores…

    ;)

  3. Bicho Says:

    Vale muy buena web incluso hoy me habia salido una duda parecida, quiero validar que el numero de elementos “checados” de un arreglo de tipo check obviamente, sea mayor a 2 y me han dicho que se podia en una sola linea, nos vemos saludos

    Muy buen blog!!

  4. Ignacio Ferreyra Says:

    Muchas gracias por la info! muy util!

  5. Jorge Linares Says:

    Gracias brother no me acordaba como recorrer los controles de un formulario tu ejemplo me sirvio y mucho, gracias…

Escribir un comentario

Please note: Comment moderation is enabled and may delay your comment. There is no need to resubmit your comment.