Questo script potrebbe avere come migliori campi di applicazione siti destinati all'e-commerce. Consente infatti di costruire un modulo (form) il cui ultimo elemento accoglie la somma di due precedenti campi, somma che si aggiorna automaticamente in base a quanto inserito dall'utente.
Lo script si compone di una sezione Javascript da inserire nella testata (<head>) della pagina e di un richiamo all'interno della parte HTML.
## 1: LA SEZIONE JAVASCRIPT
Ecco la parte di codice Javascript principale:
function startCalc(){
interval = setInterval("calc()",1);
}
function calc(){
one = document.autoSumForm.firstBox.value;
two = document.autoSumForm.secondBox.value;
document.autoSumForm.thirdBox.value = (one * 1) + (two * 1);
}
function stopCalc(){
clearInterval(interval);
}
Tre sono le funzioni. La prima e l'ultima controllano gli intervalli dell'aggiornamento e possono essere lasciate intatte.
La seconda ('calc'), olte a contenere il codice che esegue di fatto l'operazione di somma assegnando il valore all'ultimo campo di testo (document.autoSumForm.thirdBox.value = (one * 1) + (two * 1);), contiene riferimenti al form principale e ai campi di testo che lo costituiscono.
Nel caso in cui, quindi, si dovessero usare nomi diversi da quelli dell'esmepio, si ricordi di modificare di conseguenza anche i riferimenti della funzione.
## 2: LA SEZIONE HTML
Nella parte HTML trova posto il nostro form:
<form name="autoSumForm">
<input type=text name="firstBox" value="" onFocus="startCalc();"
onBlur="stopCalc();"> +
<input type=text name="secondBox" value="" onFocus="startCalc();"
onBlur="stopCalc();"> =
<input type=text name="thirdBox">
</form>
Poco da osservare, se non, ancora una volta, i nomi del modulo e dei campi, e il richiamo alle funzioni dello script da effettuare con gli eventi 'onFocus' e 'onBlur'.
