Curso de JavaScript

De WikiEducator
Saltar a: navegación, buscar



Formularios

DOM y acceso al formulario

  • Mediante el array forms del document y su array de elementos:
document.forms[0]; //primer formulario de la página web
document.forms[0].elements[0]; //elemento 0 del formulario
document.forms[0].elements[document.forms[0].elements.length-1]; //último elemento
  • Inconvenientes:
Sintaxis a veces poco concisa
Alteración del orden de los formularios en un entorno tan cambiante como la Web.

Mejor mediante el atributo name de los elementos:

var formularioPrincipal = document.formulario;
var primerElemento = document.formulario.elemento;
 <form name="formulario">
  	<input type="text" name="elemento" />
</form>

O mediante el atributo id:

var formularioPrincipal = document.getElementById("formulario");
var primerElemento = document.getElementById("elemento");
<form name="formulario" id="formulario" >
  	<input type="text" name="elemento" id="elemento" />
</form>

Propiedades y eventos de los formularios

  • Propiedades:
type: Indica el tipo de elemento del que se trata:
text, button, checkbox, select-one, select-multiple, textarea
value: obtiene el texto que se muestra en un botón o en las cajas de texto (text o textarea)...
name: se obtiene el valor del atributo name.
form: para referirse al formulario de un elemento:
document.getElementById("id_del_elemento").form
  • Eventos más habituales:
onclick
onchange: al cambiar el valor de un elemento y perder el foco
onfocusonblur: cuando el elemento tiene o pierde el foco.