Nessun risultato. Prova con un altro termine.
Guide
Notizie
Software
Tutorial
  • Lezione 16 di 30
  • livello principiante
Indice lezioni

esempio 1: un test per i visitatori

Gli esempi commentati di alcune applicazioni per il web ampiamente descritte nei capitoli precedenti.
Gli esempi commentati di alcune applicazioni per il web ampiamente descritte nei capitoli precedenti.
Link copiato negli appunti

[Unico file, salvabile con nome a piacere]

Un test del tipo "scoprite gli aspetti segreti del vostro carattere..." guida l'utente attraverso una sequenza di videate con domande. La struttura di questo esempio banale non differisce da quella dei moduli multi-step usati per raccogliere dati più complessi: informazioni personali, curriculum vitae, dati commerciali... Le differenze risiedono in:

  • tipo di input: radio-button per risposte chiuse oppure caselle di testo da riempire;
  • sequenza delle videate: obbligata oppure aperta e decisa in base ai passi intermedi.

Ciò che sicuramente accomuna ogni modulo multi-step è una lunga e spesso lenta serie di collegamenti col server web, dove sono registrati i risultati parziali.
Il nostro esempio contiene invece tutto un test in un unico file e permette di raccogliere le risposte, calcolare e restituire il risultato col solo download iniziale.
Il file per un test a tre domande "autogestito" in XML + DOM occupa solo 10 KB, di cui solo 4-5 per il codice di controllo (indipendente dal numero e dal peso delle videate). La tecnica usata è quella degli input di tipo hidden, variante opener.

Struttura dei campi hidden:
- control: raccoglie i risultati


<control>
<objn></objn>
...
</control>

- interface.input: contiene l'indicazione della prossima pagina da caricare;
- interface.output: restituisce alla pagina "opener" le risposte dell'utente raccolte nella pagina figlia.

Struttura delle function:
- library XML: le funzioni ausiliarie per usare DOM (loadXMLString, findChilds, findText, findAttributes);
- modifyControl: registra le risposte dell'utente nella struttura control;
- writeInput: identifica il punto raggiunto nella sequenza, calcola il passo successivo e lo registra nella struttura interface.input;
- newPage: legge dalla struttura interface.input la prossima pagina e la apre;
- result: a fine test legge i risultati, li elabora e restituisce la risposta del test.

Segnaliamo alcuni punti critici per il riutilizzo dell'esempio:
sequenza: devono essere identificati correttamente il momento di inizio e di fine, il percorso deve rimanere registrato anche se l'utente cambia momentaneamente pagina;
errori: è preferibile che un caso critico venga intercettato da condizioni IF prima che generi un errore nell'esecuzione;
stringhe ed "escape": ecco alcuni punti delicati
- apici annidati: onClick="alert('ciao')"
- tag di script: una stringa dichiarata all'interno di uno script (ad esempio il testo html di un pagina generata dinamicamente) non può contenere un segmento del tipo <script>; soluzione:

stringa = "<html>...<" + "script>...</" + "script>..."

Questo esempio poteva essere costruito senza ricorso all'XML, ma se la complessità aumenta, il ricorso al DOM è necessario. Ciò avviene soprattutto se la struttura control (legata alla sequenza delle videate) non è lineare, ma ad albero:


<control>
<objn attr1="" ... attrn="">testo
<objz></objz>
</objn>
<control>

Ti consigliamo anche