Jump to content

login with ajax and php


adamriley

Recommended Posts

The problem I have is when you enter a username in the textbox the page reloads

 

I would like it to update the div named "result" with the responce

 

form.html

 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Login</title>
<script language="JavaScript" type="text/javascript">
<!--
function submit(theform)
{
if (theform.username.value=="")
  {
  document.getElementById("result").innerHTML="Result : Please type a username to login!";
return false;
  }
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;
    return false;
    }
  }
xmlhttp.open("GET","login_submit.php?u="+theform.username.value,true);
xmlhttp.send();
}
//-->
</script>
</head>
<body bgcolor="#FFFFFF" text="#000000">
<div id="Form1" style="position:absolute;left:0px;top:0px;width:797px;height:414px;z-index:4;" align="left">
<form name="Form1" method="POST" action="" id="Form1" onsubmit="return submit(this)">
<input type="hidden" name="q1000" value="2">
<input type="text" id="username" style="position:absolute;left:149px;top:81px;width:424px;font-family:Courier New;font-size:16px;z-index:0" name="username" value="Username">
<input type="submit" id="Button1" name="Button1" value="Submit" style="position:absolute;left:293px;top:152px;width:75px;height:24px;font-family:Arial;font-size:13px;z-index:2">
<div id="result" style="position:absolute;left:27px;top:215px;width:500px;height:24px;z-index:3;" align="left">
<font style="font-size:21px" color="#000000" face="Arial">Result : N/A Click submit</font></div>

</form>
</div>
<div id="Text1" style="position:absolute;left:0px;top:7px;width:787px;height:32px;z-index:5;" align="center">
<font style="font-size:27px" color="#000000" face="Arial">Login</font></div>
</body>
</html>

Link to comment
https://forums.phpfreaks.com/topic/218882-login-with-ajax-and-php/
Share on other sites

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.