Getting the URL of a clicked link

JavaScript and client side scripting.

Moderator: General Moderators

Post Reply
Griven
Forum Contributor
Posts: 165
Joined: Sat May 09, 2009 8:23 pm

Getting the URL of a clicked link

Post by Griven »

Hi all.

I'm trying to build a very small analytics database for our intranet that shows where our primary exit points are. I'm using a combination of PHP, AJAX, and MySQL.

I have a link that looks like <a href="www.google.com" onclick="trackfunction()">Link</a>. Currently, my javascript creates an XMLHTTPRequest object and sends the URL of the page they are on to a PHP page, which puts that and their username into the database, along with a timestamp. What I'm missing is how to get the URL of the link that they clicked--the HREF property.

How can I dynamically pass the URL of a clicked link to my javascript function?
pbs
Forum Contributor
Posts: 230
Joined: Fri Nov 07, 2008 5:31 am
Location: Nashik, India
Contact:

Re: Getting the URL of a clicked link

Post by pbs »

Try this, it will alert the href of the link, you can replace your function and pass the this.href as a parameter to your function.

Code: Select all

 
<a href="http://www.google.com" onclick="alert(this.href); return false;">Click Here</a>
 
Griven
Forum Contributor
Posts: 165
Joined: Sat May 09, 2009 8:23 pm

Re: Getting the URL of a clicked link

Post by Griven »

That worked! Everything I want to track is now being entered into the database.

However, there is one problem. When I go back from the page I visited to my internal page, and click another link, no entry is created in the DB. It's almost as if no values are being passed to the PHP script after the back button is pressed. When the page is opened up in a new tab or a new browser, the script functions as it should again, but only for one click.

Below is the code for my two pages.

test.php

Code: Select all

<!DOCTYPE HTML>
<html>
<head>
<title>Test</title>
<script language="javascript">
<!--
function xmlhttpObject(){
    var xmlhttp;
    if (window.XMLHttpRequest){
        xmlhttp=new XMLHttpRequest();
    } else {
        xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
    }
    return xmlhttp;
}
 
function tracker(href){
    xmlhttp=xmlhttpObject();
    if (xmlhttp == null){
        alert('Browser does not support XMLHTTP.');
        return;
    }
    var inturl = window.location.href;
    var exturl = href
    var url = 'linktracker.php';
    url = url+'?inturl='+inturl;
    url = url+'&exturl='+href;
    
    xmlhttp.open("GET",url,true);
    xmlhttp.send(null);
}
 
-->
</script>
</head>
<body>
<a href="http://www.pvponline.com" onclick="tracker(this.href)">Test link</a>
<a href="http://www.google.com" onclick="tracker(this.href)">Test 2</a>
</body>
</html>
linktracker.php

Code: Select all

<?php
$db = new mysqli('localhost','username','password','database');
if ($db->connect_error){
    die();
}
 
if((!isset($_GET['inturl'])) || (!isset($_GET['exturl']))){
        //This is where I think things are falling down
        //with values not being passed after pressing 
        //the back button in the browser.
    die();  
} else {
    $inturl = $db->real_escape_string($_GET['inturl']);
    $exturl = $db->real_escape_string($_GET['exturl']);
    $user = $db->real_escape_string($_SERVER['AUTH_USER']);
}
    $insert = $db->query("INSERT INTO analytics_exitevents 
        (event_internalurl,event_externalurl,event_user) 
        VALUES ('$inturl','$exturl','$user')") or die();
    $db->close();
Any ideas as to what's going on?
pbs
Forum Contributor
Posts: 230
Joined: Fri Nov 07, 2008 5:31 am
Location: Nashik, India
Contact:

Re: Getting the URL of a clicked link

Post by pbs »

Use this AJAX code. Also user some other variable name for href in tracker() function.

Code: Select all

 
function getHTTPObject() 
    { 
        var xmlhttp; 
        /*@cc_on @if (@_jscript_version >= 5) try { xmlhttp = new ActiveXObject("Msxml2.XMLHTTP"); } catch (e) { try { xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); } catch (E) { xmlhttp = false; } } @else xmlhttp = false; @end @*/  
        if (!xmlhttp && typeof XMLHttpRequest != 'undefined') 
        { 
            try { 
                xmlhttp = new XMLHttpRequest(); 
            } 
            catch (e) { 
                xmlhttp = false; 
            } 
        } 
        return xmlhttp;
    }
    var http = getHTTPObject(); // We create the HTTP Object 
 
    function tracker(href)
    {
        var inturl = window.location.href;
        var exturl = href
        var url = 'linktracker.php';
        url = url+'?inturl='+inturl;
        url = url+'&exturl='+href;
       
        http.open("GET",url,true);
        http.send(null);
    }
 
 
Griven
Forum Contributor
Posts: 165
Joined: Sat May 09, 2009 8:23 pm

Re: Getting the URL of a clicked link

Post by Griven »

Thanks for the tip on creating the XMLHttpRequest object.

However, the issue of this not working after the back button is pressed is still present. I've reduced the complexity of my code and narrowed it down to the javascript code.

test.php

Code: Select all

function getHTTPObject()
    {
        var xmlhttp;
        /*@cc_on @if (@_jscript_version >= 5) try { xmlhttp = new ActiveXObject("Msxml2.XMLHTTP"); } catch (e) { try { xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); } catch (E) { xmlhttp = false; } } @else xmlhttp = false; @end @*/  
        if (!xmlhttp && typeof XMLHttpRequest != 'undefined')
        {
            try {
                xmlhttp = new XMLHttpRequest();
            }
            catch (e) {
                xmlhttp = false;
            }
        }
        return xmlhttp;
    }
    var http = getHTTPObject(); // We create the HTTP Object
 
    function tracker()
    {
        var url = 'linktracker.php';
        
        http.open("GET",url,true);
        http.send(null);
    }
 
-->
</script>
</head>
<body>
<a href="http://www.pvponline.com" onclick="tracker()">Test link</a>
<a href="http://www.google.com" onclick="tracker()">Test 2</a>
</body>
</html>
linktracker.php

Code: Select all

$db = new mysqli('localhost','username','password','testbed');
 
 
    $insert = $db->query("INSERT INTO analytics_exitevents 
        (event_internalurl,event_externalurl,event_user) 
        VALUES ('null','null','null')");
Previously, because the external URL value that was passed from the link via this.href, when I clicked on either link, they would each create a database record (again, only once). Now that neither of the links' onclick events is passing a value to the javascript function, there is only one database entry being created, as opposed to one for each (I hope that makes sense).

Again, the AJAX is calling up the PHP page, but only once, it seems.

Any ideas?
pbs
Forum Contributor
Posts: 230
Joined: Fri Nov 07, 2008 5:31 am
Location: Nashik, India
Contact:

Re: Getting the URL of a clicked link

Post by pbs »

Use the below given code, you will get alert for your result. echo some value or sql for each link in php page and see what it returns

Code: Select all

 
function tracker(href)
    {
        var inturl = window.location.href;
        var exturl = href
        var url = 'linktracker.php';
        url = url+'?inturl='+inturl;
        url = url+'&exturl='+href;
       
        http.open("GET",url,true);
        http.onreadystatechange = getResponse; 
        http.send(null);
    }
    
    function getResponse()
    {
        if (http.readyState == 4)
        {
            var result = http.responseText;
            alert(result);
        }
    }
 
Griven
Forum Contributor
Posts: 165
Joined: Sat May 09, 2009 8:23 pm

Re: Getting the URL of a clicked link

Post by Griven »

I just tried out your code.

When I first click on a link, no alert box pops up, and a database record is created for that click. When I go back and click the link again, I get an alert box with nothing in it. I've tried assigning values to all of my die() functions, but nothing is returned.

:banghead:
Post Reply