Problema con visualizzazione errore

[Tigermat]

Ciao a tutti, vediamo se riesco a farvi capire il mio problema...

Ho una pagina "index.php" che in base alla voce del menu di navigazione selezionata mi carica (all'interno di un div) il codice relativo a ciò che effettivamente voglio far vedere.
Quindi, se clicco la voce "Contattami" mi ricarica la pagina index con al centro (posizione del div "principale") il form per inviarmi una mail.

Il mio problema si verifica quando controllo che i campi "obbligatori" siano stati compilati o meno: ho collegato il bottone "submit" ad una funzione scritta in JS che effettivamente fa il controllo e mi scrive (nel caso in cui uno dei campi non fosse stato compilato) "È obbligatorio!" vicino al campo non compilato.

A questo punto vi chiederete dove sia il problema! Infatti si verifica dopo aver visualizzato l'errore e consiste nel fatto che se schiaccio il bottone mi esegue la funzione (infatti appaiono le scritte), ma subito dopo mi ricarica l'index e adotta la pagina di default (nel mio caso la homepage), quindi mi scompare tutto.

A me servirebbe un qualcosa per bloccare tutto una volta scritti gli errori, in modo tale da permettere all'utente di correggerli!! Spero di essere stato chiaro...

Form:

<form name="modulo" onsubmit="controlloForm();"> 	

<label>Nome 
 
<input type="text" name="required_nome" value=""> (*) </label> 		
<input type="text" class="error" disabled="disabled" readonly="readonly" name="errore_nome" value=""> 	
 	

<label>Cognome 
 
<input type="text" name="required_cognome" value=""> (*) </label> 		
<input type="text" class="error" disabled="disabled" readonly="readonly" name="errore_cognome" value=""> 	
 	

<label>Email 
 <input type="text" name="required_email" value=""> (*) </label> 
<input type="text" class="error" disabled="disabled" readonly="readonly" name="errore_email" value="">	
 	

<label>Messaggio 
 
<textarea type="text" name="messaggio" value="" rows="6" cols="40" ></textarea></label> 	
 	

<input type="submit" value="Invia" style="position: relative; width: 75px; margin-top: 10px; left: 135px;" /> 

</form>

Javascript:

function controlloForm(){

if(document.modulo.required_nome.value == ""){
      document.modulo.errore_nome.value = "È Obbligatorio!";
      document.modulo.errore_nome.disabled = "none";
}


if(document.modulo.required_cognome.value == ""){
      document.modulo.errore_cognome.value = "È Obbligatorio!";
      document.modulo.errore_cognome.disabled = "none";
}


if(document.modulo.required_email.value == ""){
      document.modulo.errore_email.value = "È Obbligatorio!";
      document.modulo.errore_email.disabled = "none";

}

}

[softhare]

Nel codice del form cambia
<form name="modulo" onsubmit="controlloForm();">
con
<form name="modulo" onsubmit="return controlloForm();">

E poi cambi lo script così:

function controlloForm(){

if(document.modulo.required_nome.value == ""){
      document.modulo.errore_nome.value = "È Obbligatorio!";
      document.modulo.errore_nome.disabled = "none";
     return false;
}


if(document.modulo.required_cognome.value == ""){
      document.modulo.errore_cognome.value = "È Obbligatorio!";
      document.modulo.errore_cognome.disabled = "none";
     return false;
}


if(document.modulo.required_email.value == ""){
      document.modulo.errore_email.value = "È Obbligatorio!";
      document.modulo.errore_email.disabled = "none";
      return false;
}
return true;
}

[Tigermat]

Grazie mille, ora funziona tutto come deve