I have a form which works for both registration and login and am using javaScript Ajax to submit it.
It is working fine in Mozilla firefox but fails in Chrome and IE.
I'm trying to execute a AJAX and PHP script that checks database with email id in the text box. If email id already exists in database it shows password field(Login) otherwise other mandtatory fields. ie name and phone number(Register).
My main problem is that this part is not working.
document.getElementById("contbtn").style="display:none";
document.getElementById("subbtn").style="display:block";
Here is the javaScript Ajax code:
<script>
function CheckUser()
{
var uemail = document.getElementById("email").value;
var xmlhttp;
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("txtHint").innerHTML=xmlhttp.responseText;
var frm_element = document.getElementById('contbtn');
var vis = frm_element.style;
if (vis.display=='' || vis.display=='none') {
vis.display = 'block';
}
else {
vis.display = 'none';
}
var frm_element1 = document.getElementById('subbtn');
var vis1 = frm_element1.style;
if (vis1.display=='' || vis1.display=='none') {
vis1.display = 'block';
}
else {
vis1.display = 'none';
}
}
}
xmlhttp.open("GET","check_user.php?emlid="+uemail,true);
xmlhttp.send();
}
</script>
<body>
<form action="" method="post">
<ul class="contactform">
<li><label>Email</label><input name="email" id="email" required="" onblur=" return CheckUser();" type="text"></li>
<div id="txtHint"></div>
<li>
<input class="btn" id="contbtn" onclick="CheckUser();" type="button" value="Next" style="display: block;">
<input class="btn" id="subbtn" style="display: none;" type="submit" value="Submit">
</li>
</ul>
</form>
