Creare uno script javascript utilizzando i form e far convalidare la pagina in XHTML strict.
ALLWEB free
Web Directory Script Linguaggi
Italiano Inglese Tutte
 
 02 Sep 2014
aggiungi in preferiti  
Home    Mappa directory    Script




Convalida di un form js con XHTML strict:


Il seguente articolo Ŕ stato testato sui seguenti browser:
  • Internet explorer 7
  • Mozilla Firefox 2
  • Opera 9


Il linguaggio XHTML prevede alcune regole per la compilazione delle pagine che a volte possono creare non pochi problemi a chi sta cercando di convertire dal vecchio HTML.
Uno dei problemi Ŕ quello di far convalidare una pagina dove Ŕ presente un form manipolato da javascript.

In effetti alcuni script prevedono l'utilizzo del form ricavando direttamente le variabili tramite il loro nome (name=".....").
Questa procedura non Ŕ consentita durante la convalida XHTML STRICT.

La soluzione viene dallo stesso javascript, che mette a disposizione del programmatore un'altro metodo per ricavare il valore delle variabili e modificarlo a proprio piacimento.
In pratica posiamo arrivare al campo del form indicando il numero del form (dall'inizio pagina), ed il numero del campo (dall'inizio del form).



Esempio con HTML:

Immaginiamo di dover creare un form che moltiplichi per 5 il valore immesso in un campo, e faccia apparire nello stesso campo il risultato.

Apparentemente Ŕ uno script molto semplice, il codice HTML/JAVASCRIPT potrebbe essere il seguente:

<script type="text/javascript">
<!--
function moltiplica(){
document.h.aw.value=document.h.aw.value*5
}
-->
</script>
<form name="h" action="#">
<input size="3" name="aw">
<input onclick=moltiplica(); type="button" value="Moltiplica x 5">
</form>

In pratica funziona su tutti i browser, ma se proviamo a convalidare il form in XHTML STRICT otteniamo un errore come questo:
there is no attribute "name".
In sostanza se vogliamo far convalidare la pagina come XHTML STRICT dobbiamo trovare una strada alternativa all'attributo name="".
Possiamo scrivere
<form id="h" action="#">
ERRATO perchŔ funziona con Internet Explorer ma non funziona con Firefox.



Metodo js alternativo

Per utilizzare i campi del form senza dichiararne il nome, javascript ci aiuta permettendoci di arrivare al campo del form dichiarando semplicemente a quale form (da inizio pagina) e a quale campo form (dall'inizio del form) ci stiamo riferendo. In pratica non necessitiamo di nessun nome.

Questo Ŕ il risultato che otterremo mettendo in pratica quello appena detto:


Questo Ŕ il codice:

<script type="text/javascript">
<!--
function moltiplica(){
document.forms[2].elements[0].value=document.forms[2].elements[0].value*5
}
-->
</script>
<form action="#">
<div>
<input size="3" />
<input onclick="moltiplica();" type="button" value="Moltiplica x 5" />
</div>
</form>

Come potrete notare non abbiamo dichiarato nessun nome all'interno del form, ma lo script funziona con tutti i browser ed Ŕ compatibile con le direttive XHTML STRICT.

La riga che riesce ad arrivare ai dati Ŕ la seguente:
document.forms[2].elements[0].value
Nel nostro caso il form Ŕ il numero 2 (il terzo partendo da zero, dopo quello di ricerca in alto a destra e quello di ricerca a fianco delle icone stampa e fumetto).
Mentre per il campo form Ŕ il numero 0, ossia il primo dopo il tag form.