<?php
include("sessionLogin.php");
include("connect.php");
$user=$_SESSION['client'];

$query=mysql_query("select * from customer where userID='$user'");
$display=mysql_fetch_array($query);
$email = $display['email'];

?>
<html>
<head>
<link rel="stylesheet" type="text/css" href="website.css" />
</head>
<body class="client">
<h2>Update your email address</h2>

<p>Your current email address is <?php echo $email;?></p>
<a href="account.php"><< Back</a>
<table class="inner2" style="background-color:#EFEFEF" width=80%>
<tr>
	<td><h3>Enter your new email address</h3>
		<form action="updatingEmail.php" method="POST" onsubmit="return finalcheck()">
		<table cellpadding=5>
		<tr>
			<td>Enter new email address :</td>
			<td><input type="text" name="address1" style="width:300" onblur="vali(this.name,this.value)"/><div id="address1field"></div></td>
			</tr>
		<tr>
			<td>Re-enter new email address :</td>
			<td><input type="text" name="address2" style="width:300"onblur="valiMatch(this.value,address1.value)"/><div id="address2field"></div></td>
			</tr>
		<tr>
			<td colspan=2><input type="submit" value="Submit" style="background-color:#4f85bb;width:100;height:30;font-weight:bolder;color:#fff"/></td>
			</tr>
			</table>
		</form>
	
	</td>
	</tr>
	</table>
<script type="text/javascript">
function finalcheck(){
	var data1 = document.getElementById("address1field");
	var data2 = document.getElementById("address2field");
	
	if(data1.innerHTML!="OK"){
		alert("Please fill in new email address","Alert");
		return false;
	}
	if(data2.innerHTML!="OK"){
		alert("Please re-enter new email address","Alert");
		return false;
	}
	
	return true;

}
function valiMatch(add2,add1){

if(add2.length==0){
	document.getElementById("address2field").innerHTML = "*Please fill in";
	myObj=document.getElementById("address2field");
	myObj.style.color = "red";	
	return;
}

if(add2!=add1){
	document.getElementById("address2field").innerHTML = "*Email No match";
	myObj=document.getElementById("address2field");
	myObj.style.color = "red";	
	return;
}

if(add2==add1){
	document.getElementById("address2field").innerHTML = "OK";
	myObj=document.getElementById("address2field");
	myObj.style.color = "green";	
	return;
}



}
function vali(name,value){
	if(value.length==""){
		document.getElementById(name+"field").innerHTML = "*Please fill in";
		myObj=document.getElementById(name+"field");
		myObj.style.color = "red";	
		return;
	}
	
	if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject('Microsoft.XMLHTTP');
  }
xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    document.getElementById(name+'field').innerHTML=xmlhttp.responseText;
	myObj=document.getElementById(name+"field");
	
	if(xmlhttp.responseText=="OK"){
		myObj.style.color = "green";
	}else{
		myObj.style.color = "red";
	}
    }
  }
  
xmlhttp.open('GET','valiEdit.php?name='+name+'&value='+value,true);

xmlhttp.send();


}


</script>


</body>
</html>