Controllare campi di un form prima di effettuare l'invio

**doppioconfronto** · 05-12-2018, 11:03

Ciao a tutti, ho un problema con la validazione di un form. Il codice che posto sotto spedisce dei dati ad una pagina in php e la parte di js dovrebbe verificare che i dati nei primi 2 campi del form contengano solo testo, però mi spedisce la pagina senza fare questo controllo.
Dove sbaglio?

codice HTML:

[COLOR=#1D2129][FONT=Helvetica]
<head>
<meta charset="UTF-8">
<title>Prova</title>
<script>
function controllaForm() {
var soloTesto = /^([a-zA-Z '])+$/;[/FONT][/COLOR]
[FONT=inherit]if (!soloTesto.test(document.form[0].nome.value)) {
alert("Il nome inserito non e' valido!");
document.form[0].nome.focus();
return false;
}
if (!soloTesto.test(document.form[0].cognome.value)) {
alert("Il cognome inserito non e' valido!");
document.form[0].cognome.focus();
return false;
</script>
</head>
<body>[/FONT]
[FONT=inherit]<form action="http://localhost/sito1/new1.php" method="post" name="form">
Nome:<br>
<input type="text" name="nome" /> <br>
Cognome:<br>
<input type="text" name="cognome"/> <br>
Data di nascita <br>
<input type="date" name="data" /> <br> <br>
<input type="submit" value="Invia" onClick ="controllaForm()">
<input type="reset" value="cancella">
</form>[/FONT]
[FONT=inherit]</body>
[/FONT]

**ciro78** · 05-12-2018, 21:32

posta meglio il codice

**doppioconfronto** · 06-12-2018, 23:07

codice HTML:

<head><meta charset="UTF-8">
<title>Prova</title>
<script>
function controllaForm() {
var soloTesto = /^([a-zA-Z '])+$/;[/FONT][/COLOR]
[FONT=inherit]if (!soloTesto.test(document.form[0].nome.value)) {
alert("Il nome inserito non e' valido!");
document.form[0].nome.focus();
return false;
}
if (!soloTesto.test(document.form[0].cognome.value)) {
alert("Il cognome inserito non e' valido!");
document.form[0].cognome.focus();
return false;
</script>
</head>
<body>[/FONT]
[FONT=inherit]<form action="http://localhost/sito1/new1.php" method="post" name="form">
Nome:<br>
<input type="text" name="nome" /> <br>
Cognome:<br>
<input type="text" name="cognome"/> <br>
Data di nascita <br>
<input type="date" name="data" /> <br> <br>
<input type="submit" value="Invia" onClick ="controllaForm()">
<input type="reset" value="cancella"> 
</form>
</body>

**ciro78** · 06-12-2018, 23:09

scusami ma [FONT=inherit] che roba è?

**doppioconfronto** · 07-12-2018, 11:28

Originariamente inviata da ciro78

scusami ma [FONT=inherit] che roba è?

Non fa parte del mio codice originale, si è generato dopo che ho messo i tags html qui sul forum, comunque a parte questo, non pensavo di aver posto un quesito così complicato

**M4V1** · 07-12-2018, 13:40

Usa event.preventDefault() per fermare il submit del form, fai le ue verifiche e in caso sia tutto corretto invia il form manualmente con form.submit().

**doppioconfronto** · 07-12-2018, 14:19

Grazie per la risposta, ma indicativamente, in che punto del codice l'inserisco?

**M4V1** · 07-12-2018, 17:21

Il preventDefault() all'inizio della funzione che richiami nell'onClick ed il subit alla fine della stessa funzione.

Guardati come funziona l'invio dei form tramite js.

Discussione: Controllare campi di un form prima di effettuare l'invio

Strumenti discussione

Ricerca discussione

Visualizza

Controllare campi di un form prima di effettuare l'invio

Permessi di invio