Member Avatar for georgeee123

Hi, I am working on a chat program.
When a user logs in, a value in the database is set to 1 (online), and when he/she logs out it is set to 0 (offline).
The problem is, when the user exits the browser, naturally the value is still set to 1.
I was wondering if it is possible using AJAX or otherwise to update the database on the event of browser close?
I have tried onbodyunload in the body tags pointing to a file with a JavaScript function containing the PHP code (query to update the field) but cant get it to work.
If anybody has any advice, please help me it is driving me mad and is the biggest problem standing in my way to get the app to work...thanks you very much in advance for any replies :)

  • 3 Contributors
  • 7 Replies
  • 399 Views
  • 5 Days Discussion Span
  • Latest Post Latest Post by georgeee123
Member Avatar for sudeepjd

Yes using AJAX is possible and I've done this before. Try the Javascript onunload() event and link that to your AJAX.

I've got it to work in the past. If you still have problems please let me know.

Edited by sudeepjd because: n/a
Member Avatar for georgeee123

Hi, I have tried onunload() and onbeforeunload() and cant get either of them to update the database. If you PLEASE let me know how you did it, it would be great.
The way I tried was (sometihng like):

<body onuload="update();">

and a JS function (in the header) something like:

update(){
<?php
QUERY GOES HERE
?>

Using this approach makes it set to 0 (offline) as soon as the page loads up.
I have also tried it in an external JS file with the query in it and it stays as online all the time (does not change atall).
}
Thanks again for the replies I appreciate it loads :)

Member Avatar for sudeepjd

Well the body tag should be as you have put it <body onunload="update();"> Put this in the javascript section to check if the onunload works

update(){
    alert("Unload event");
}

If on closing the browser window you get a dialog box, then you know that the function works.

From here you then need to call the AJAX function using the update() AJAX is not called just by putting the PHP code within the function. It uses a XMLHttpRequest() to submit the query to an external PHP file which processes the request and then returns the required result. Check out the W3School AJAX tutorial at http://www.w3schools.com/ajax/default.asp.

For your application this external PHP file would the the one that signs your user out i.e., the one you are currently using in the update() function. The reason you are getting the user logged out when the page loads up is that PHP is always processed before the page is loaded and the code in the update function is being processed anyway which logs the user out, setting the value to 0.

If you are getting the Unload event dialog box that I mentioned earlier and are not able to understand AJAX please let me know.

Edited by sudeepjd because: n/a
Member Avatar for georgeee123

Hi, thanks for your help, I have tried and I am getting the Unload event text but I am struggling with the AJAX side, if you could help me further that would be grteat, thanks.

Member Avatar for scrappedcola

To make an ajax call to a php page take a look at this tutorial: Simple PHP/Ajax tutorial. Basically you need to create an XMLHTTP object then open a connection with the server page and then do something with the response.

<script>
function MakeRequest()
{
  var xmlHttp = getXMLHttp();
  
  xmlHttp.onreadystatechange = function()
  {
    if(xmlHttp.readyState == 4)
    {
      HandleResponse(xmlHttp.responseText);
    }
  }

  xmlHttp.open("GET", "YOUR PAGE HERE.php", true); 
  xmlHttp.send(null);
}
function getXMLHttp()
{
  var xmlHttp

  try
  {
    //Firefox, Opera 8.0+, Safari
    xmlHttp = new XMLHttpRequest();
  }
  catch(e)
  {
    //Internet Explorer
    try
    {
      xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
    }
    catch(e)
    {
      try
      {
        xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
      }
      catch(e)
      {
        alert("Your browser does not support AJAX!")
        return false;
      }
    }
  }
  return xmlHttp;
}
function HandleResponse(response)
{
  document.getElementById('ResponseDiv').innerHTML = response;
}
</script>

You would change the part of the open function that I have listed as Your Page Here to the url of the server side code (php) that you want to execute and update the db.

Member Avatar for georgeee123

To make an ajax call to a php page take a look at this tutorial: Simple PHP/Ajax tutorial. Basically you need to create an XMLHTTP object then open a connection with the server page and then do something with the response.

<script>
function MakeRequest()
{
  var xmlHttp = getXMLHttp();
  
  xmlHttp.onreadystatechange = function()
  {
    if(xmlHttp.readyState == 4)
    {
      HandleResponse(xmlHttp.responseText);
    }
  }

  xmlHttp.open("GET", "YOUR PAGE HERE.php", true); 
  xmlHttp.send(null);
}
function getXMLHttp()
{
  var xmlHttp

  try
  {
    //Firefox, Opera 8.0+, Safari
    xmlHttp = new XMLHttpRequest();
  }
  catch(e)
  {
    //Internet Explorer
    try
    {
      xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
    }
    catch(e)
    {
      try
      {
        xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
      }
      catch(e)
      {
        alert("Your browser does not support AJAX!")
        return false;
      }
    }
  }
  return xmlHttp;
}
function HandleResponse(response)
{
  document.getElementById('ResponseDiv').innerHTML = response;
}
</script>

You would change the part of the open function that I have listed as Your Page Here to the url of the server side code (php) that you want to execute and update the db.

Brilliant thank you so much!!

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.