[successivo] [precedente] [inizio] [fine] [indice generale] [indice ridotto] [indice analitico] [volume] [parte]


Capitolo 557.   Verifiche automatiche con JavaScript

Questo capitolo contiene la descrizione di un programma molto semplice, scritto con il linguaggio JavaScript, per la realizzazione di verifiche che generano automaticamente la valutazione. Il programma descritto riguarda una verifica di esempio e serve solo come idea di un modello da utilizzare per la realizzazione di altre verifiche del genere.

Si osservi che un meccanismo molto simile a quello descritto in questo capitolo si può utilizzare all'interno di Alml (capitolo 500), che genera automaticamente il codice JavaScript necessario.

Viene mostrato subito il listato completo della pagina HTML contenente il programma; nelle sezioni successive viene descritto nelle sue varie componenti.

<HTML LANG="it">
<HEAD>
    <META HTTP-EQUIV="Content-Type" CONTENT="text/html">
    <TITLE>Verifica banale</TITLE>
    <SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript">
    <!--
        //
        // Something to do at the beguinning.
        //
        // Get the initial time stamp.
        //
        var start_time = new Date ();
        //
        // Countdown function.
        //
        function countdown (time_allowed)
        {
            var hours;
            var minutes;
            var seconds;
            var time;
            var time_string;
            var time_sign;
            //
            // Verify the countdown time sign.
            //
            if (time_allowed > 0)
              {
                time_sign = "";
              }
            else
              {
                time_sign = "-";
              }
            //
            // Find the absolute countdown value.
            //
            time = Math.abs (time_allowed);
            //
            hours   = (time - (time % 3600000)) / 3600000;
            time    = time - (hours * 3600000);
            minutes = (time - (time % 60000)) / 60000;
            time    = time - (minutes * 60000);
            seconds = (time - (time % 1000)) / 1000;
            //
            if (minutes < 10)
              {
                minutes = "0" + minutes;
              }
            if (seconds < 10)
              {
                seconds = "0" + seconds;
              }
            if (hours < 10)
              {
                hours = "0" + hours;
              }
            //
            time_string = time_sign + hours + ":" + minutes + ":" + seconds;
            //
            // Show the time string inside some text field.
            //
            document.test_form_1.countdown_0.value = time_string;
            document.test_form_1.countdown_1.value = time_string;
            document.test_form_1.countdown_2.value = time_string;
            //
            // Reduce 10 s inside the countdown variable.
            //
            time_allowed = time_allowed - 10000;
            //
            // Wait for 10 s for the recursive call.
            //
            setTimeout ("countdown (" + time_allowed + ")", 10000);
            //
        }
        //
        // Radio button scan function.
        //
        function scan_radio_button (radio_button)
        {
            var counter;
            //
            for (counter = 0; counter < radio_button.length; counter++)
              {
                if (radio_button[counter].checked)
                  {
                    return (counter + 1);
                  }
              }
            //
            // Nothing found.
            //
            return 0;
        }
        //
        // Check test_form_1.
        //
        function check_test_form_1 (start_time)
        {
            //
            var end_time = new Date ();
            var test_time = end_time - start_time;
            var time_allowed = 1 * 60000;
            var time_delay = test_time - time_allowed;
            //
            if (time_delay < 0)
              {
                time_delay = 0;
              }
            //
            // Penalty for a minute delay.
            //
            var score_time_penalty = 0.5;
            //
            // Set the result for every choice.
            //
            var score_dita_di_una_mano = new Array();
            score_dita_di_una_mano[0] = 0;
            score_dita_di_una_mano[1] = 0;
            score_dita_di_una_mano[2] = 0;
            score_dita_di_una_mano[3] = 0;
            score_dita_di_una_mano[4] = 0;
            score_dita_di_una_mano[5] = 0;
            score_dita_di_una_mano[6] = 5;
            score_dita_di_una_mano[7] = 0;
            score_dita_di_una_mano[8] = 0;
            //
            // Set the result for every choice.
            //
            var score_dita_di_un_piede = new Array();
            score_dita_di_un_piede[0] = 0;
            score_dita_di_un_piede[1] = 0;
            score_dita_di_un_piede[2] = 0;
            score_dita_di_un_piede[3] = 0;
            score_dita_di_un_piede[4] = 0;
            score_dita_di_un_piede[5] = 0;
            score_dita_di_un_piede[6] = 5;
            score_dita_di_un_piede[7] = 0;
            score_dita_di_un_piede[8] = 0;
            //
            // Save the personal data.
            //
            var student = document.test_form_1.student.value;
            var date = document.test_form_1.date.value;
            //
            // Scan the radio buttons.
            //
            var dita_di_una_mano = scan_radio_button (document.test_form_1.dita_di_una_mano);
            //
            var dita_di_un_piede = scan_radio_button (document.test_form_1.dita_di_un_piede);
            //
            // Calculate the results.
            //
            var account_score_time_penalty;
            var account_score_dita_di_una_mano;
            var account_score_dita_di_un_piede;
            var account_score_sum = 0;
            //
            account_score_time_penalty = (time_delay / 1000) * (score_time_penalty / 60);
            //
            account_score_dita_di_una_mano = score_dita_di_una_mano[dita_di_una_mano];
            account_score_dita_di_un_piede = score_dita_di_un_piede[dita_di_un_piede];
            account_score_sum = account_score_sum - account_score_time_penalty;
            account_score_sum = account_score_sum + account_score_dita_di_una_mano;
            account_score_sum = account_score_sum + account_score_dita_di_un_piede;
            //
            // Reset the form to avoid the use of the [Back] button
            // from the browser.
            //
            document.test_form_1.reset();
            //
            // Print a simple HTML header.
            //
            document.writeln ("<HTML>");
            document.writeln ("<HEAD>");
            document.writeln ("<TITLE>Risultato della verifica</TITLE>");
            document.writeln ("</HEAD>");
            document.writeln ("<BODY>");
            //
            // Print a H1 title and some personal data.
            //
            document.writeln ("<H1>Verifica banale</H1>");
            document.writeln ("<P>studente: " + student + "</P>");
            document.writeln ("<P>data: " + date + "</P>");
            //
            // Print about time.
            //
            document.write ("<P>inizio della verifica: ");
            document.write (start_time.getYear());
            document.write (".");
            document.write (start_time.getMonth() + 1);
            document.write (".");
            document.write (start_time.getDate());
            document.write (" ");
            document.write (start_time.getHours());
            document.write (":");
            document.write (start_time.getMinutes());
            document.write (".");
            document.write (start_time.getSeconds());
            document.writeln ("</P>");
            //
            document.write ("<P>conclusione della verifica: ");
            document.write (end_time.getYear());
            document.write (".");
            document.write (end_time.getMonth() + 1);
            document.write (".");
            document.write (end_time.getDate());
            document.write (" ");
            document.write (end_time.getHours());
            document.write (":");
            document.write (end_time.getMinutes());
            document.write (".");
            document.write (end_time.getSeconds());
            document.writeln ("</P>");
            //
            document.write ("<P>durata complessiva della verifica: ");
            document.write (test_time / 1000);
            document.write ("&nbsp;s, ");
            document.write (test_time / 1000 / 60);
            document.write ("&nbsp;m;");
            document.writeln ("</P>");
            //
            document.write ("<P>tempo a disposizione: ");
            document.write (time_allowed / 1000);
            document.write ("&nbsp;s; ");
            document.write ("ritardo: ");
            document.write (time_delay / 1000);
            document.write ("&nbsp;s; ");
            document.write ("penalit&agrave;/minuto: ");
            document.write (score_time_penalty);
            document.write ("; ");
            document.write ("penalit&agrave; complessiva: ");
            document.write (account_score_time_penalty);
            document.writeln ("</P>");
            //
            // First question.
            //
            document.write ("<P>Quante sono le dita di una mano? risposta n. ");
            document.write (dita_di_una_mano);
            document.write ("; ");
            document.write ("punteggio: ");
            document.write (account_score_dita_di_una_mano);
            document.writeln ("</P>");
            //
            // Second question.
            //
            document.write ("<P>Quante sono le dita di un piede? risposta n. ");
            document.write (dita_di_un_piede);
            document.write ("; ");
            document.write ("punteggio: ");
            document.write (account_score_dita_di_un_piede);
            document.writeln ("</P>");
            //
            // Final result.
            //
            document.write ("<P>Punteggio complessivo della verifica: ");
            document.write (account_score_sum);
            document.writeln ("</P>");
            //
            // End of HTML.
            //
            document.writeln ("</BODY>");
            document.writeln ("</HTML>");
            //
            // Print with a printer.
            //
            window.print ();
            //
            // Stop loading.
            //
            window.stop ();
        }
        //-->
        </SCRIPT>
</HEAD>
<BODY onLoad="document.test_form_1.reset(); countdown (1 * 60000);">

<H1>Verifica banale</H1>

<FORM NAME="test_form_1" METHOD="get" ACTION="">

    <P>Tempo a disposizione: <INPUT TYPE="TEXT" NAME="countdown_0" SIZE="10" VALUE=" "></P>

    <P>Cognome, nome, classe:
    <INPUT TYPE="TEXT" SIZE="60" NAME="student" VALUE="">
    </P>

    <P>Data:
    <INPUT TYPE="TEXT" SIZE="60" NAME="date" VALUE="">
    </P>

    <P>Tempo a disposizione: <INPUT TYPE="TEXT" NAME="countdown_1" SIZE="10" VALUE=" "></P>

    <P><STRONG>Quante sono le dita di una mano?</STRONG></P>
    <OL>
    <LI><INPUT TYPE="RADIO" NAME="dita_di_una_mano">0 dita</LI>
    <LI><INPUT TYPE="RADIO" NAME="dita_di_una_mano">1 dita</LI>
    <LI><INPUT TYPE="RADIO" NAME="dita_di_una_mano">2 dita</LI>
    <LI><INPUT TYPE="RADIO" NAME="dita_di_una_mano">3 dita</LI>
    <LI><INPUT TYPE="RADIO" NAME="dita_di_una_mano">4 dita</LI>
    <LI><INPUT TYPE="RADIO" NAME="dita_di_una_mano">5 dita</LI>
    <LI><INPUT TYPE="RADIO" NAME="dita_di_una_mano">6 dita</LI>
    <LI><INPUT TYPE="RADIO" NAME="dita_di_una_mano">7 dita</LI>
    </OL>

    <P>Tempo a disposizione: <INPUT TYPE="TEXT" NAME="countdown_2" SIZE="10" VALUE=" "></P>

    <P><STRONG>Quante sono le dita di un piede?</STRONG></P>
    <OL>
    <LI><INPUT TYPE="RADIO" NAME="dita_di_un_piede">0 dita</LI>
    <LI><INPUT TYPE="RADIO" NAME="dita_di_un_piede">1 dita</LI>
    <LI><INPUT TYPE="RADIO" NAME="dita_di_un_piede">2 dita</LI>
    <LI><INPUT TYPE="RADIO" NAME="dita_di_un_piede">3 dita</LI>
    <LI><INPUT TYPE="RADIO" NAME="dita_di_un_piede">4 dita</LI>
    <LI><INPUT TYPE="RADIO" NAME="dita_di_un_piede">5 dita</LI>
    <LI><INPUT TYPE="RADIO" NAME="dita_di_un_piede">6 dita</LI>
    <LI><INPUT TYPE="RADIO" NAME="dita_di_un_piede">7 dita</LI>
    </OL>

    <P><INPUT TYPE="button" VALUE="concludi la verifica"
        onClick="check_test_form_1(start_time)"></P>

</FORM>

</BODY>
</HTML>

557.1   Utilizzo del programma

Il file mostrato all'inizio del capitolo è una pagina HTML che incorpora il codice JavaScript; per visualizzarla occorre un navigatore comune, in grado di eseguire il codice JavaScript. Potrebbe apparire come nella figura successiva:

javascript verifica banale

Come si vede, appare un modello da compilare; al termine si deve selezionare il bottone <concludi la verifica> per ottenere l'esito. Ecco cosa si potrebbe ottenere se sono state date tutte le risposte in modo esatto, ma con un leggero ritardo rispetto ai tempi concessi:

javascript verifica banale

In condizioni normali, dovrebbe apparire anche una finestra di conferma per la stampa dell'esito della verifica.

Si può osservare che la pagina normale della verifica viene azzerata completamente a ogni tentativo di ripristino della pagina e di azzeramento del tempo, in modo da scoraggiare un uso scorretto della verifica.

557.2   Codice HTML

Il codice HTML significativo è quello contenuto nell'elemento BODY. La prima cosa che si può osservare è l'associazione dell'evento onLoad alla chiamata della funzione document.test_form_1.reset() e successivamente della funzione countdown():

<BODY onLoad="document.test_form_1.reset(); countdown (1 * 60000);">

In pratica, la prima delle due funzioni esiste in quanto è stato definito il modulo (elemento FORM) denominato test_form_1 e serve ad azzerarne il contenuto; la seconda funzione è dichiarata nel codice JavaScript che appare nell'intestazione della pagina e il suo scopo è quello di azzerare il conto alla rovescia, in modo che parta da 60 000 ms (pari a 60 s, ovvero un minuto).

Con l'evento onLoad associato in questo modo alle due funzioni appena descritte, si vuole fare in modo che a ogni caricamento della pagina il suo contenuto si azzeri e il conteggio del tempo a disposizione riparta. Questa accortezza serve a evitare che si possa barare sulla durata, lasciando comunque la possibilità di ricominciare, prima di avere concluso la verifica, purché ci sia il tempo complessivo necessario.

Successivamente, dopo un titolo, si vede un elemento FORM, che contiene in pratica le varie componenti da compilare della verifica: alcuni campi descrittivi, due gruppi di bottoni di selezione e il bottone di conclusione della verifica:

<FORM NAME="test_form_1" METHOD="get" ACTION="">
    ...
    <P>Cognome, nome, classe:
    <INPUT TYPE="TEXT" SIZE="60" NAME="student" VALUE="">
    </P>
    ...
    <P><STRONG>Quante sono le dita di una mano?</STRONG></P>
    <OL>
    <LI><INPUT TYPE="RADIO" NAME="dita_di_una_mano">0 dita</LI>
    <LI><INPUT TYPE="RADIO" NAME="dita_di_una_mano">1 dita</LI>
    <LI><INPUT TYPE="RADIO" NAME="dita_di_una_mano">2 dita</LI>
    <LI><INPUT TYPE="RADIO" NAME="dita_di_una_mano">3 dita</LI>
    <LI><INPUT TYPE="RADIO" NAME="dita_di_una_mano">4 dita</LI>
    <LI><INPUT TYPE="RADIO" NAME="dita_di_una_mano">5 dita</LI>
    <LI><INPUT TYPE="RADIO" NAME="dita_di_una_mano">6 dita</LI>
    <LI><INPUT TYPE="RADIO" NAME="dita_di_una_mano">7 dita</LI>
    </OL>
    ...
    <P><INPUT TYPE="button" VALUE="concludi la verifica"
        onClick="check_test_form_1(start_time)"></P>
</FORM>

L'elenco numerato (OL) contenente gli elementi di selezione di tipo RADIO (che pertanto consentono una sola selezione nel gruppo), serve a definire la scelta di una domanda a risposta multipla.

Al bottone finale viene abbinato l'evento onClick, in modo da avviare contestualmente la funzione check_test_form_1(), fornendo alla stessa l'orario esatto di inizio della verifica.

Si può osservare che inizialmente, l'elemento FORM contiene anche l'attributo METHOD e ACTION, che però sono perfettamente inutili, dal momento che non si usa alcun programma CGI.

Qua e là, appare anche un campo particolare, che ha lo scopo di ospitare l'indicazione del tempo a disposizione, che decresce progressivamente:

<P>Tempo a disposizione: <INPUT TYPE="TEXT" NAME="countdown_2" SIZE="10" VALUE=" "></P>

In questo campo non si deve scrivere, ma anche se fosse, il contenuto verrebbe rimpiazzato periodicamente con l'informazione del tempo che decresce.

557.3   Variabili globali

All'inizio del programma appare la dichiarazione di una variabile globale:

<SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript">
<!--
    //
    // Get the initial time stamp.
    //
    var start_time = new Date ();

Lo scopo è quello di accumulare al caricamento della pagina la data e l'orario iniziale. Successivamente, questa informazione viene passata come argomento della funzione check_test_form_1(), come già descritto in precedenza.

557.4   Conto alla rovescia

Una porzione del programma JavaScript è dedicata alla gestione di un orologio che mostra il tempo a disposizione all'interno dei campi del tipo:

<INPUT TYPE="TEXT" NAME="countdown_2" SIZE="10" VALUE=" ">

Questo lavoro è svolto dalla funzione countdown(), che richiede come argomento il tempo a disposizione, espresso in millesimi di secondo:

function countdown (time_allowed)
{
    var hours;
    var minutes;
    var seconds;
    var time;
    var time_string;
    var time_sign;
    //
    // Verify the countdown time sign.
    //
    if (time_allowed > 0)
      {
        time_sign = "";
      }
    else
      {
        time_sign = "-";
      }
    //
    // Find the absolute countdown value.
    //
    time = Math.abs (time_allowed);
    //
    hours   = (time - (time % 3600000)) / 3600000;
    time    = time - (hours * 3600000);
    minutes = (time - (time % 60000)) / 60000;
    time    = time - (minutes * 60000);
    seconds = (time - (time % 1000)) / 1000;
    //
    if (minutes < 10)
      {
        minutes = "0" + minutes;
      }
    if (seconds < 10)
      {
        seconds = "0" + seconds;
      }
    if (hours < 10)
      {
        hours = "0" + hours;
      }
    //
    time_string = time_sign + hours + ":" + minutes + ":" + seconds;
    //
    // Show the time string inside some text field.
    //
    document.test_form_1.countdown_0.value = time_string;
    document.test_form_1.countdown_1.value = time_string;
    document.test_form_1.countdown_2.value = time_string;
    //
    // Reduce 10 s inside the countdown variable.
    //
    time_allowed = time_allowed - 10000;
    //
    // Wait for 10 s for the recursive call.
    //
    setTimeout ("countdown (" + time_allowed + ")", 10000);
}

Il lavoro iniziale della funzione è quello di separare le varie componenti del tempo, in modo da individuare le ore, i minuti e i secondi, avendo anche l'accortezza di aggiungere uno zero iniziale quando il valore corrispondente ha una sola cifra. Il risultato di questa scomposizione viene aggregato nella variabile time_string, in modo da produrre qualcosa di simile a «00:10:20» (zero ore, 10 minuti e 20 secondi), avendo cura anche di mostrare un segno se il valore è negativo; fatto questo, il valore della stringa viene copiato nei campi che servono a visualizzare il conteggio (document.test_form_1.countdown_n.value).

Una volta provveduto a mostrare il valore aggiornato nei campi rispettivi, si decrementa il tempo a disposizione di 10 s e si esegue una chiamata ricorsiva attraverso l'aiuto della funzione setTimeout().

La funzione setTimeout() serve a eseguire una funzione, passata come stringa, dopo che è trascorso un certo tempo, senza bloccare il funzionamento del programma complessivo. In questo caso, si avvia la stessa funzione countdown(), passando il valore aggiornato del tempo a disposizione, dopo che sono passati 10 s. Secondo la modalità normale di programmazione, sarebbe più logico eseguire un ciclo iterativo, inserendo una pausa in quel punto, ma in questo caso ciò non è possibile, sia perché manca una funzione appropriata nel linguaggio JavaScript, sia perché una tale funzione bloccherebbe il funzionamento del programma, impedendo così la compilazione del modulo e l'invio della verifica.

Una cosa da osservare è che il ciclo di aggiornamento dell'orologio che mostra il conto alla rovescia è di 10 s, mentre sarebbe facilissimo ridurlo a un solo secondo:

    //
    // Reduce 1 s inside the countdown variable.
    //
    time_allowed = time_allowed - 1000;
    //
    // Wait for a second for the recursive call.
    //
    setTimeout ("countdown (" + time_allowed + ")", 1000);

La scelta di avere un aggiornamento meno frequente dipende solo dall'intenzione di non agitare inutilmente chi sta svolgendo la verifica.

557.5   Scansione di un elenco di tipo «RADIO»

Le domande a risposta multipla vengono gestite attraverso componenti del modulo di tipo RADIO. L'insieme dell'elenco si ottiene tramite un nome del tipo seguente; in pratica, nel caso del primo elenco si tratta del nome document.test_form_1.dita_di_una_mano:

document.form.radio

Questo nome rappresenta precisamente un array di valori logici, con cui si può poi verificare se il bottone corrispondente è stato premuto o meno:

if (document.form.radio[n].checked)
  {
    ...
  }

Il primo elemento dell'array si raggiunge con l'indice zero e corrisponde al primo dei bottoni.

Nel programma JavaScript proposto viene usata una funzione apposita per la scansione di un gruppo di bottoni di questo tipo:

function scan_radio_button (radio_button)
{
    var counter;
    for (counter = 0; counter < radio_button.length; counter++)
      {
        if (radio_button[counter].checked)
          {
            return (counter + 1);
          }
      }
    return 0;
}

In pratica, attraverso la variabile radio_button si ottiene l'array da scandire, quindi si utilizza un contatore per verificare i vari elementi. Se si incontra un bottone premuto, la funzione termina il suo ciclo e restituisce il valore dell'indice aumentato di una unità, mentre se non viene trovato premuto alcun bottone, viene restituito il valore zero.

Come si comprende, la chiamata di questa funzione avviene in un modo simile a quello seguente:

dita_di_una_mano = scan_radio_button (document.test_form_1.dita_di_una_mano);

557.6   Valutazione della verifica

Si ottiene la valutazione della verifica con chiamata della funzione check_test_form_1() che richiede di fornire la data e l'ora di inizio. La chiamata di questa funzione viene innescata dal bottone che si trova alla fine del modulo:

<P><INPUT TYPE="button" VALUE="concludi la verifica"
        onClick="check_test_form_1(start_time)"></P>

La funzione in questione contiene delle informazioni fisse, che potrebbero essere passate tramite gli argomenti. Si tratta precisamente del tempo a disposizione (che deve combaciare con quello stabilito per la chiamata della funzione che esegue il conto alla rovescia) e della penalità nel punteggio da applicare a ogni minuto di ritardo:

function check_test_form_1 (start_time)
{
    //
    var end_time = new Date ();
    var test_time = end_time - start_time;
    var time_allowed = 1 * 60000;
    var time_delay = test_time - time_allowed;
    //
    if (time_delay < 0)
      {
        time_delay = 0;
      }
    //
    // Penalty for a minute delay.
    //
    var score_time_penalty = 0.5;

Oltre a questo, c'è da osservare che la funzione contiene internamente l'informazione su quali sono le risposte corrette, attraverso degli array che contengono il punteggio da dare per ogni risposta. Si osservi che in questo caso, l'elemento iniziale (con indice zero) corrisponde alla mancanza di alcuna selezione:

    //
    // Set the result for every choice.
    //
    var score_dita_di_una_mano = new Array();
    score_dita_di_una_mano[0] = 0;
    score_dita_di_una_mano[1] = 0;
    score_dita_di_una_mano[2] = 0;
    score_dita_di_una_mano[3] = 0;
    score_dita_di_una_mano[4] = 0;
    score_dita_di_una_mano[5] = 0;
    score_dita_di_una_mano[6] = 5;
    score_dita_di_una_mano[7] = 0;
    score_dita_di_una_mano[8] = 0;
    //
    // Set the result for every choice.
    //
    var score_dita_di_un_piede = new Array();
    score_dita_di_un_piede[0] = 0;
    score_dita_di_un_piede[1] = 0;
    score_dita_di_un_piede[2] = 0;
    score_dita_di_un_piede[3] = 0;
    score_dita_di_un_piede[4] = 0;
    score_dita_di_un_piede[5] = 0;
    score_dita_di_un_piede[6] = 5;
    score_dita_di_un_piede[7] = 0;
    score_dita_di_un_piede[8] = 0;

Successivamente, nella funzione vengono salvati i dati descrittivi, che servono a identificare chi ha eseguito la verifica:

    //
    // Save the personal data.
    //
    var student = document.test_form_1.student.value;
    var date = document.test_form_1.date.value;

Si passa quindi alla scansione delle risposte e al calcolo del punteggio corrispondente:

    //
    // Scan the radio buttons.
    //
    var dita_di_una_mano = scan_radio_button (document.test_form_1.dita_di_una_mano);
    //
    var dita_di_un_piede = scan_radio_button (document.test_form_1.dita_di_un_piede);
    //
    // Calculate the results.
    //
    var account_score_time_penalty;
    var account_score_dita_di_una_mano;
    var account_score_dita_di_un_piede;
    var account_score_sum = 0;
    //
    account_score_time_penalty = (time_delay / 1000) * (score_time_penalty / 60);
    //
    account_score_dita_di_una_mano = score_dita_di_una_mano[dita_di_una_mano];
    account_score_dita_di_un_piede = score_dita_di_un_piede[dita_di_un_piede];
    account_score_sum = account_score_sum - account_score_time_penalty;
    account_score_sum = account_score_sum + account_score_dita_di_una_mano;
    account_score_sum = account_score_sum + account_score_dita_di_un_piede;

Terminata l'acquisizione e valutazione dei dati, si ha cura di azzerare il modulo, in modo da assicurare che non possa essere utilizzabile il bottone per il ritorno alla pagina precedente tramite il navigatore ipertestuale per modificare la verifica già terminata:

    //
    // Reset the form to avoid the use of the [Back] button
    // from the browser.
    //
    document.test_form_1.reset();

Successivamente si passa alla fase di produzione di una nuova pagina HTML con l'esito della verifica. Si osservi che a seconda dell'interprete JavaScript usato, l'anno potrebbe essere visualizzato correttamente o meno (per esempio, l'anno 2005 potrebbe essere mostrato come 105), ma si tratta di un errore trascurabile per i fini di questo prototipo:

    //
    // Print a simple HTML header.
    //
    document.writeln ("<HTML>");
    document.writeln ("<HEAD>");
    document.writeln ("<TITLE>Risultato della verifica</TITLE>");
    document.writeln ("</HEAD>");
    document.writeln ("<BODY>");
    //
    // Print a H1 title and some personal data.
    //
    document.writeln ("<H1>Verifica banale</H1>");
    document.writeln ("<P>studente: " + student + "</P>");
    document.writeln ("<P>data: " + date + "</P>");
    //
    // Print about time.
    //
    document.write ("<P>inizio della verifica: ");
    document.write (start_time.getYear());
    document.write (".");
    document.write (start_time.getMonth() + 1);
    document.write (".");
    document.write (start_time.getDate());
    document.write (" ");
    document.write (start_time.getHours());
    document.write (":");
    document.write (start_time.getMinutes());
    document.write (".");
    document.write (start_time.getSeconds());
    document.writeln ("</P>");
    //
    document.write ("<P>conclusione della verifica: ");
    document.write (end_time.getYear());
    document.write (".");
    document.write (end_time.getMonth() + 1);
    document.write (".");
    document.write (end_time.getDate());
    document.write (" ");
    document.write (end_time.getHours());
    document.write (":");
    document.write (end_time.getMinutes());
    document.write (".");
    document.write (end_time.getSeconds());
    document.writeln ("</P>");
    //
    document.write ("<P>durata complessiva della verifica: ");
    document.write (test_time / 1000);
    document.write ("&nbsp;s, ");
    document.write (test_time / 1000 / 60);
    document.write ("&nbsp;m;");
    document.writeln ("</P>");
    //
    document.write ("<P>tempo a disposizione: ");
    document.write (time_allowed / 1000);
    document.write ("&nbsp;s; ");
    document.write ("ritardo: ");
    document.write (time_delay / 1000);
    document.write ("&nbsp;s; ");
    document.write ("penalit&agrave;/minuto: ");
    document.write (score_time_penalty);
    document.write ("; ");
    document.write ("penalit&agrave; complessiva: ");
    document.write (account_score_time_penalty);
    document.writeln ("</P>");
    //
    // First question.
    //
    document.write ("<P>Quante sono le dita di una mano? risposta n. ");
    document.write (dita_di_una_mano);
    document.write ("; ");
    document.write ("punteggio: ");
    document.write (account_score_dita_di_una_mano);
    document.writeln ("</P>");
    //
    // Second question.
    //
    document.write ("<P>Quante sono le dita di un piede? risposta n. ");
    document.write (dita_di_un_piede);
    document.write ("; ");
    document.write ("punteggio: ");
    document.write (account_score_dita_di_un_piede);
    document.writeln ("</P>");
    //
    // Final result.
    //
    document.write ("<P>Punteggio complessivo della verifica: ");
    document.write (account_score_sum);
    document.writeln ("</P>");
    //
    // End of HTML.
    //
    document.writeln ("</BODY>");
    document.writeln ("</HTML>");

Al termine, si può osservare l'uso della funzione window.print() per invitare alla stampa del risultato, in modo da poterlo consegnare all'insegnante. Si osservi che con alcuni navigatori potrebbe anche non funzionare, ma rimane la possibilità di comandare la richiesta di stampa tramite il menù del navigatore stesso.

Alla fine della funzione, per completezza, viene usata la funzione window.stop(), per interrompere il caricamento della pagina, che con alcuni navigatori rimane attivo, nonostante non ci sia altro da attendere.

    //
    // Print with a printer.
    //
    window.print ();
    //
    // Stop loading.
    //
    window.stop ();
}

557.7   Riferimenti

Appunti di informatica libera 2007.02 --- Copyright © 2000-2007 Daniele Giacomini -- <daniele (ad) swlibero·org>


Dovrebbe essere possibile fare riferimento a questa pagina anche con il nome verifiche_automatiche_con_javascript.htm

[successivo] [precedente] [inizio] [fine] [indice generale] [indice ridotto] [indice analitico]

Valid ISO-HTML!

CSS validator!