Validazione campi

09-07-2017, 09.45.06

Ciao a tutti,
premetto che di javascript sono proprio a zero.
Ho trovato una funzione su internet in java appunto cercando di adattarla al mio form ma a qiuanto pare non funziona.
Chi di voi è così gentile da dirmi come fare? Di seguito posto sia il form in HTML sia lo script in java.
Grazie infinite.

HTML

Codice HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=11" />
<meta http-equiv="X-UA-Compatible" content="chrome=1" />
<meta name="description" content="Azienda agricola Tappero Bertot">
<meta name="robots" content="index, follow">
<meta http-equiv="content-language" content="it">
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
<meta name="viewport" content="width=device-width">

<title>Documento senza titolo</title>

<link href="../css/modulomail.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="../js/validator.js"></script>

</head>

<body>
<form name="contact_form" method="post" action="invio.php">
<table width="300" border="0" align="center" cellpadding="10" cellspacing="3" id="table_cliente">
  <tr>
    <td align="center">Informazioni del cliente</td>
  </tr>
</table>
<table width="360" height="205"border="0" align="center" cellpadding="0" cellspacing="0" id="table_cont">
  <tr>
    <td width="30" height="200" align="center"><table width="100%" border="0" cellpadding="8" cellspacing="1" id="table1">
      <tr>
        <td width="30" valign="middle">Nome</td>
        <td width="70" valign="middle"><input name="fname" type="text" value="" placeholder="Inserisci il tuo nome"></td>
      </tr>
      <tr>
        <td valign="middle">Mail</td>
        <td valign="middle"><input name="text" type="mail" value="" placeholder="Inserisci la tua mail"></td>
      </tr
      ><tr>
        <td valign="middle">Telefono</td>
        <td valign="middle"><input name="phone" type="text" value="" size="10" maxlength="10"placeholder="Telefono"></td>
      </tr>
      <tr>
        <td valign="middle">Oggetto</td>
        <td valign="middle"><input name="subject" type="text" placeholder="Oggetto (es.Ordine)"></td>
      </tr>
    </table></td>
    <td width="65%" height="205"align="center"><table width="100%" border="0" cellpadding="8" cellspacing="3" id="table2">
      <tr>
        <td valign="middle">Richiesto</td>
      </tr>
      <tr>
        <td valign="middle">Richiesto</td>
      </tr>
      <tr>
        <td valign="middle">Richiesto</td>
      </tr>
      <tr>
        <td valign="middle">&nbsp;</td>
      </tr>
    </table></td>
  </tr>
</table>
<table width="300" border="0" align="center" cellpadding="10" cellspacing="3" id="table_mess">
  <tr>
    <td align="center">Il tuo messaggio</td>
  </tr>
</table>
<table width="400" border="0" align="center" cellpadding="10" cellspacing="3" id="table_messaggio">
  <tr>
    <td width="40" align="center"></td>
  </tr>
  <tr>
    <td align="center">Messaggio</td>
    <td align="center"><textarea name="message" cols="35" rows="5" placeholder="Scrivi qui il tuo messaggio"></textarea></td>
    <td align="center">Richiesto</td>
  </tr>
  <tr>
    <td align="right">&nbsp;</td>
    <td align="center"><input type="reset" name="reset" value="Reset"/> <input type="submit" name="Submit" value="Invia" onclick="return thisform(this.contact_form)"></td>
  </tr>
</table>
</form>
</body>
</html>

JAVAscript

Codice:

// JavaScript Document
function thisform(contact_form) {
	if(contact_form.fname.value == "") {
	alert('Riempire il campo: Nome');
	return false;
	}
}

**mzanella** · 09-07-2017, 11.23.45

Dipende dal tipo di validazione che vuoi ottenere. Se vuoi solo controllare che un campo sia stato compilato, sei sulla strada giusta.

Un modo ancora più semplice è usare l'attributo required nei campi che vuoi siano compilati:

Codice HTML:

<input name="fname" type="text" value="" placeholder="Inserisci il tuo nome" required>

Aggiungere comunque dei controlli in JavaScript non è una cattiva idea. Quando dici "non funziona" cosa intendi? Qual'è il risultato atteso e cosa succede invece?

Ho trovato una funzione su internet in java

Javascript

!

09-07-2017, 11.51.06

Alla fine ho risolto in questo modo.

HTML

Codice HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Documento senza titolo</title>

<link href="../css/modulomail.css" rel="stylesheet" type="text/css" />
<script type="text/javascript">
function validateForm () {
	var fname = document.forms["contact_form"]["fname"].value;
	var mail = document.forms["contact_form"]["mail"].value;
	var phone = document.forms["contact_form"]["phone"].value;
	var message = document.forms["contact_form"]["message"].value;


		if (fname == null || fname == "") {
			alert("Il campo Nome non può essere lasciato vuoto.");
			return false;
		}
		if (mail == null || mail == "") {
			alert("Il campo Mail non può essere lasciato vuoto.");
			return false;
		}
		if (phone == null || phone == "") {
			alert("Il campo Telefono non può essere lasciato vuoto.");
			return false;
		}
		if (message == null || message == "") {
			alert("Il campo Messaggio non può essere lasciato vuoto.");
			return false;
		}
var mail_corretta = /ˆ([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-]{2,})+\.)+([a-zA-Z0-9]{2,})+$/;
	if (!mail_corretta.test(mail) || (mail =="") || (mail == "undefined")) {
		alert("Inserire un indirizzo mail corretto.");
		document.modulo.mail.select();
		return false;
	}
}
			
</script>
</head>

<body>
<form name="contact_form"  action="invio.php" onsubmit="return validateForm()" method="post">
<table width="300" border="0" align="center" cellpadding="10" cellspacing="3" id="table_cliente">
  <tr>
    <td align="center">Informazioni del cliente</td>
  </tr>
</table>
<table width="360" height="205"border="0" align="center" cellpadding="0" cellspacing="0" id="table_cont">
  <tr>
    <td width="30" height="200" align="center"><table width="100%" border="0" cellpadding="8" cellspacing="1" id="table1">
      <tr>
        <td width="30" valign="middle">Nome</td>
        <td width="70" valign="middle"><input name="fname" type="text" id="fname" placeholder="Inserisci il tuo nome"></td>
      </tr>
      <tr>
        <td valign="middle">Mail</td>
        <td valign="middle"><input name="mail" type="text" placeholder="Inserisci la tua mail"></td>
      </tr>
      <tr>
        <td valign="middle">Telefono</td>
        <td valign="middle"><input name="phone" type="text" id="phone"placeholder="Telefono" size="10" maxlength="10"></td>
      </tr>
      <tr>
        <td valign="middle">Oggetto</td>
        <td valign="middle"><input name="subject" type="text" placeholder="Oggetto (es.Ordine)"></td>
      </tr>
    </table></td>
    <td width="65%" height="205"align="center"><table width="100%" border="0" cellpadding="8" cellspacing="3" id="table2">
      <tr>
        <td valign="middle">Richiesto</td>
      </tr>
      <tr>
        <td valign="middle">Richiesto</td>
      </tr>
      <tr>
        <td valign="middle">Richiesto</td>
      </tr>
      <tr>
        <td valign="middle">Facoltativo</td>
      </tr>
    </table></td>
  </tr>
</table>
<table width="300" border="0" align="center" cellpadding="10" cellspacing="3" id="table_mess">
  <tr>
    <td align="center">Il tuo messaggio</td>
  </tr>
</table>
<table width="400" border="0" align="center" cellpadding="10" cellspacing="3" id="table_messaggio">
  <tr>
    <td width="40" align="center"></td>
  </tr>
  <tr>
    <td align="center">Messaggio</td>
    <td align="center"><textarea name="message" cols="35" rows="5" id="message" placeholder="Scrivi qui il tuo messaggio"></textarea></td>
    <td align="center">Richiesto</td>
  </tr>
  <tr>
    <td align="right">&nbsp;</td>
    <td align="center"><input type="reset" name="reset" value="Reset"/> <input type="submit" name="Submit" value="Submit"></td>
  </tr>
</table>
</form>
</body>
</html>

Discussione: Validazione campi

LinkBack

Strumenti discussione

Display

Validazione campi

Risolto.

Regole di scrittura