Lavora con noi

JavaScript

Siti tematici

Speciali

Ajax

JavaScript » Articoli » Effetti e controlli Javascript

Pagine:

RSS Download

Pre-validazione di un form con Javascript

di: Alvin Laini 24 Settembre 2007

La funzione "validazione" riceve come argomento il nome del form a cui deve essere applicata; questo fa sì che l'analisi degli elementi del form per cercare determinati attributi coinvolga solo specifici form e non tutto il contenuto della pagina HTML, risparmiando cosi risorse. Questo stratagemma viene applicato utilizzando "document.form1.innerHTML", che prende tutto il codice HTML compreso tra i tag <form> e </form>.

Prima di analizzare il codice contenuto nel form viene verificato se la funzione "document.getElementsByTagName" è supportata dal browser: se così non è la convalida dei campi non potrà essere portata a termine.

Attraverso questa funzione verranno ricercati i tag specificati all'interno dell'array "tipo_dati" del form; una volta trovato uno di questi tag, se ne ricavano gli attributi standard con i loro valori (es. name, value, type etc.) ma anche quelli da me inseriti a cui assegnerò delle specifiche azioni in seguito.

Il riconoscimento avviene tramite questi semplici step:

a) La lista di tag trovati viene messa sotto forma di array nella variabile "x" usando questa funzione:

var x=document.getElementsByTagName(tipo_dati[j]);

dove tipo_dati[j] sta per uno dei tag da ricercare preso dal mio array tipo_dati popolato in partenza.

b) A questo punto l'array viene ciclato per tutta la sua lunghezza, immagazzinando di volta in volta il nome del campo trovato nella variabile "campo" con questa istruzione:

var campo=x.item(i).name;.

c) Avviene poi il riconoscimento del browser, in quanto Internet Explorer e Firefox hanno due modi di operare differenti per quanto concerne la lettura tramite DOM degli attributi di campo.

IE accede agli attributi utilizzando:

document.getElementsByTagName("nome campo").item("posizione").nome_attributo;

Ad esempio, per accedere al campo "obbligatorio" si utilizzerà la seguente istruzione:

document.getElementsByTagName(tipo_dati[j]).item(i).obbligatorio;.

Firefox invece necessita di un array contenente gli attributi del campo. Per fare ciò si utilizza la seguente istruzione

var test =document.getElementsByTagName(tipo_dati[j]).item(i).attributes

e poi si ciclano tutti gli attributi presenti nell'array "test"; intercettando il nome degli attributi di validazione da me aggiunti si salvano quindi i valori in alcune variabili:

for(var a=test.length-1; a>=0; a--)
{
switch(test[a].name)
{
case "obbligatorio":
var obbligatorio=test[a].value;
break;
case "msg_errore":
var msg=test[a].value;
break;
case "dato":
var tipo_dato=test[a].value;
break;
case "regex":
var regex=test[a].value;
break;
}
}