Ciao a tutti.
sto realizzando un form in cui far inserire all'utente nome, cognome, email, e dei dati di preferenza sulla pagina come colore di sfondo e carattere da usare.
Vorrei fare in modo che quando si clicca sul pulsante registra vengano controllate la correttezza dell'indirizzo e-mail e l'inserimento di nome, cognome, e-mail, colore di sfondo, username, password e controllo della password.
Il codice che ho realizzato fino ad ora è seguente
Ho provato ad eseguire il codice con firefox. Ma se non inserisco alcun dato nel form non mi viene visualizzato il messaggio che mi avvisa della mancanza dei dati, ma due finestrelle senza alcun messaggio.codice:<!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" /> <style type="text/css"> .registra { border:thick solid #0C3 } form { width: 500px} .ss{ font-family: sans-serif } .tnr{ font-family: times new roman } .a{ font-family: arial } .v{ font-family: verdana } .nove{ font-size: 9pt } .dieci{ font-size: 10pt } .dodici{ font-size: 12pt } .quattordici{ font-size: 14pt } .arancio{ background-color: red } </style> <title>Form di registrazione</title> <script language="javascript" type="text/javascript"> <!-- function set_cookie(nome, valore, giorni) {align="right" //window.alert("all'interno di set cookie"); var dateOggi = new Date(); var date = new Date(); date.setTime(dateOggi.getTime()+24*giorni*60*60*1000); document.cookie="nome cookie="+nome +";"+escape(valore)+"; expires ="+date.toGMTString(); } function get_cookie(n) { //creiamo un vettore con il nome, il contenuto e la data di scadenza del cookie var cookieTokens = document.cookie.split("; "); for(var i=0;i < cookieTokens.length;i++) { var Token = cookieTokens[i].split("="); if(n==Token[0]) return (unescape(Token[1])); } } function check_form(f){ var msg="Sono stati rilevati i seguenti errori:"; var email_pattern=/^\w+@([\w.])+\w+$/; var error=false; if(f.Nome.value==""){ msg=msg+"\n Campo nome obbligatorio."; error=true; } if(f.Cognome.value==""){ msg=msg+"\n Campo cognome obbligatorio."; error=true; } if(!email_pattern.test(f.mail.value)){ msg=msg+"\n Campo e-mail non corretto."; error=true; } if((f.sx.unchecked)&&(f.dx.unchecked)){ msg=msg+"\nSelezionare il posizionamento del menu"; error=true; } if(f.Colore.selected==false){ msg=msg+"\nSelezionare il colore di sfondo"; error=true; } if(f.Colore2.selected==false){ msg=msg+"\nSelezionare il colore del carattere"; error=true; } if(f.psw.value==""){ msg=mas+"\nInserire la password"; error=true; } if(f.psw.value!=f.Controllo_psw.value){ msg=msg+"\nInserire di nuovo il controllo password!!"; error=true; } if(f.usr.value==""){ msg=msg+"\n Campo Username obbligatorio."; error=true; } if(error){ window.alert(msg); return false; } else { var string; string = "Nome="+escape(f.Nome.value)+" Cognome="+escape(f.Cognome.value)+" Mail="+escape(f.mail.value)+" Sfondo="+ escape (f.Colore.value)+" DimCar="+escape(f.DimCar.value)+" Carattere="+escape(f.Tipo.value)+" ColCar="+escape(f.Colore2.value); if(f.dx.checked) string=string+" Align=destra"; if(f.sx.checked) string=string+" Align=sinistra"; string=string+" Usr="+escape(f.usr.value)+" Password="+escape(f.psw.value)+" "; set_cookie("xr", string, 10); return true; } } function answer(f){ var s; var vett; s=get_cookie("xr"); window.alert(s); vett=s.split(" "); for(var i=0;i < vett.length;i++) { window.alert(vett[i]); } //a seconda del valore di align nel cookie carico un file che ha il menù a destra a sinistra switch(vett[7]) { case "Align=destra": document.URL="FrameDx"; break; case "Align=sinistra": document.URL="FrameSx"; break; } document.URL="menu.html" window.alert("ma non carica nulla"); } //--> </script> </head> <body> <form name="Reg" action="javascript:answer(document.Reg)" method="post" target="_top" id="Reg" onsubmit="return(check_form(this))" > <div class="registra"> Nome: <input name="Nome" type="text" maxlength="30" /> </p> Cognome: <input name="Cognome" type="text" maxlength="30" /> </p> E-mail: <input name="mail" type="text" maxlength="30" /> </p> <p align="center">Seleziona le tue preferenze sulla pagina:</p> <label> Colore sfondo </label> <select name="Colore" id="Colore" > <option>Rosso</option> <option>Giallo</option> <option>Verde</option> <option>Nero</option> <option>Rosa</option> <option>Marrone</option> <option>Blu</option> <option>Viola</option> <option>Bianco</option> </select> </p> <p align="center">Carattere: </p> Dimenzioni: <select name="DimCar" id="DimCar"> <option class="nove">9</option> <option class="dieci">10</option> <option class="dodici">12</option> <option class="quattordici">14</option> <option>16</option> <option>18</option> <option>20</option> <option>22</option> <option>24</option> <option>26</option> <option>28</option> <option>30</option> <option>32</option> <option>34</option> <option>36</option> <option>38</option> <option>40</option> </select> Tipo: <select name="Tipo" id="Tipo"> <option class="a">Arials</option> <option class="v">Verdana</option> <option class="tnr">Times new roman</option> <option class="ss">Sans serif</option> </select> Colore <select name="Colore2" id="Colore2"> <option class="arancio">Arancione</option> <option>Blu</option> <option>Giallo</option> <option>Marrone</option> <option>Nero</option> <option>Oro</option> <option>Rosa</option> <option>Rosso</option> <option>Verde</option> <option>Viola</option> </select> </p> <p align="center" >Posizione del menu:</p> <p align="center"> <label> <input type="radio" name="align" id="dx" value="dx" /> destra</label> <label> <input type="radio" name="align" id="sx" value="sx" /> sinistra</label> </p> <p align="center">Dati di registrazione:</p> <label>Username <input type="text" name="usr" id="usr" /> </label> </p> <label>Password: <input type="password" name="psw" id="psw" /> </label> </p> <label>Inserire nuovamente password: <input type="password" name="Controllo psw" id="Controllo_psw" /> </label> </p> <p align="center"> <label> <input type="submit" name="Invia" id="Invia" value="Registra" /> </label> </p> </div> </form> </body> </html>
Sono alle prime armi con javascript e sto cercando di capire il perchè, sapreste aiutarmi?
vi ringrazio in anticipo
Rispondi quotando
