Click tracking with jQuery, PHP and MySQL

[keithwtaylor]

Hello phpFreaks!

 

I'm hoping someone can outsmart me here: I am writing (what should have been) simple click tracking code. Links have an onclick call to a JavaScript function which uses jQuery's $.post function to run back-end PHP code which inserts the details in to database table.

 

Links are defined like this...

 

<a href="sports.php" onclick="trackClick('index.php: Sports');">

<a href="sports.php" onclick="trackClick('Nav: Test');">

 

trackClick(linkDescription) is defined like this...

 

function trackClick(linkDescription) {

  $.post("trackClick.php", {linkDesc: linkDescription});

}

 

And  trackClick.php looks contains...

 

<?php

  header("Cache-Control: no-cache");

  @mysql_connect("localhost", $dbusr, $dbpwd);

  @mysql_select_db("mydb");

  $link = $_REQUEST['linkDesc'];

  $query = "INSERT INTO clicks (dt, link) VALUES (NOW(), '$link')";

  @mysql_query($query);

?>

 

And great - it seemed to work at first, until I realised it was only working sporadically. If, for example, I clicked on a link 5 times in succession, there would be maybe 3 or 4 database entries. If I pause for a while, click on link, there is no database entry, but if I click on it twice in succession, there is one database entry. What gives?

 

Note that I could not get the backend PHP code to work using the $_POST variable which is how I thought it would work.

 

Thanks a lot for your time and help!!

 

Keith

[patrickmvi]

you may want to adding "return" in front of the trackClick function and having it return "true".  I believe this would force the browser to wait until the trackClick function has completed before it proceeds.  It would also depend on whether or not JQuery's post method is synchronous or asynchronous.  If it's asynchronous, it may return before it actually completes and then your browser leaves to go to the next page without finishing the actual post.  Using a straight http request object (this is browser depending) allows you to set whether or not the request is synchronous or asynchronous, I don't know about JQuery's wrapper stuff.

[keithwtaylor]

Thanks, I've changed the trackClick function defintion so that is returns true...

 

function trackClick(linkDescString) {

  $.post("trackClick.php", {linkDesc: linkDescString});

  return true;

}

 

...and have changed the onclick expressions to...

 

<a href="sports.php" onclick="return trackClick('index.php: Sports');">

 

Its really bizarre. If a click on a link, wait 5 seconds, click on another, wait 5 seconds and so on - none of these clicks are recorded. However if I click on a link, and then straight away I click on the same link (or any link for that matter), then the second click is recorded.

 

Anybody got any ideas?