<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
$(".controllo").attr("src","no.png");
$(".controllo").hide();
startTime();
$("form").submit(function(event){
event.preventDefault();
});
$("#nome").change(function(){
var valore = $("#nome").val();
var l = valore.length;
if(l<2){
$("#nome").val("");
$("#nomectrl").attr("src","no.png");
$("#nomectrl").show();
}else{
$("#nomectrl").attr("src","si.png");
$("#nomectrl").show();
}
});
$("#cognome").change(function(){
var valore = $("#cognome").val();
var l = valore.length;
if(l<2){
$("#cognome").val("");
$("#cognomectrl").attr("src","no.png");
$("#cognomectrl").show();
}else{
$("#cognomectrl").attr("src","si.png");
$("#cognomectrl").show();
}
});
$("#username").change(function(){
var valore = $("#username").val();
var l = valore.length;
if(l<8){
$("#username").val("");
$("#usernamectrl").attr("src","no.png");
$("#usernamectrl").show();
}else{
var campo = "username";
loadXMLDoc(valore,campo);
}
});
$("#email").change(function(){
var valore = $("#email").val();
var i = valore.indexOf("@");
if(i==-1){
$("#email").val("");
$("#emailctrl").attr("src","no.png");
$("#emailctrl").show();
}else{
var campo = "email";
loadXMLDoc(valore,campo);
}
});
$("#email2").change(function(){
var valore = $("#email2").val();
var valore2 = $("#email").val();
if(valore===valore2){
$("#email2ctrl").attr("src","si.png");
$("#email2ctrl").show();
}else{
$("#email2").val("");
$("#email2ctrl").attr("src","no.png");
$("#email2ctrl").show();
}
});
});
function startTime() {
var today=new Date();
var dd = today.getDate();
var mm = today.getMonth();
mm++;
var aaaa = today.getFullYear();
if(dd<10){
dd = "0"+dd;
}
if(mm<10){
mm = "0"+mm;
}
$("#testa h2").html(dd+"/"+mm+"/"+aaaa);
}
function loadXMLDoc(valore,campo)
{
var xmlhttp;
if (window.XMLHttpRequest){
xmlhttp=new XMLHttpRequest();
}else{
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function(){
if (xmlhttp.readyState==4 && xmlhttp.status==200){
var risposta = xmlhttp.responseText;
var n = risposta.indexOf("VERO");
if (n==-1){
$("#"+campo+"ctrl").attr("src","si.png");
}else{
$("#"+campo+"ctrl").attr("src","no.png");
$("#"+campo).val("");
}
$("#"+campo+"ctrl").show();
}
}
xmlhttp.open("GET","cerca.php?valore='"+valore+"'&campo='"+campo+"'",true);
xmlhttp.send();
}
function controllo(){
var controlla = true;
var campoNome = $("#nome").val();
var campoCognome = $("#cognome").val();
var campoUsername = $("#username").val();
var campoEmail = $("#email").val();
var campoEmail2 = $("#email2").val();
if(campoNome===""){
controlla=false;
}
if(campoCognome===""){
controlla=false;
}
if(campoUsername===""){
controlla=false;
}
if(campoEmail===""){
controlla=false;
}
if(campoEmail2===""){
controlla=false;
}
if(controlla){
$("form").submit(function(event){
$(this).unbind('submit').submit();
});
}
}
</script>
<style>
#testa h1{
margin:auto;
text-align:center;
}
#testa h2{
position:relative;
top:-54px;left:20px;
}
#testa{
margin-bottom:20px;
}
#corpo{
}
.controllo{
width:32px;height:32px;
}
table, input{
font-family:Arial, Sans-serif;
font-size:150%;
}
table{
margin-left:20px;
}
table td:nth-child(1){
text-align:right;
}
</style>
</head>
<body>
<div id="testa">
<h1>TITOLO DELLA PAGINA</h1>
<h2></h2>
</div>
<div id="corpo">
<form action="iscrizione.php" method="GET">
<table>
<tr>
<td>Nome:</td>
<td><input id="nome" type="text" name="nome"/></td>
<td><img class="controllo" id="nomectrl" src="" /></td>
</tr>
<tr>
<td>Cognome:</td>
<td><input id="cognome" type="text" name="cognome"/></td>
<td><img class="controllo" id="cognomectrl" src="" /></td>
</tr>
<tr>
<td>Username:</td>
<td><input id="username" type="text" name="username"/></td>
<td><img class="controllo" id="usernamectrl" src="" /></td>
</tr>
<tr>
<td>Email:</td>
<td><input id="email" type="text" name="email"/></td>
<td><img class="controllo" id="emailctrl" src="" /></td>
</tr>
<tr>
<td>Ripeti Email:</td>
<td><input id="email2" type="text" name="email2"/></td>
<td><img class="controllo" id="email2ctrl" src="" /></td>
</tr>
<tr>
<td></td>
<td><button type="submit" onclick="controllo()">INVIA</button></td>
<td></td>
</tr>
</table>
</form>
</div>
</body>
</html>