No element found FF - Error visible in firebug

Question

I'm creating a global high score table. The JavaScript sends the username and score to the PHP through some AJAX functions and POST. The PHP script then takes the variable, and compares the score values to the file on the server. It then puts the new score where it should go on the score table, and rewrites the file.

I had it working last night, but now, when I call the function, it displays my code instead, and firebug gives the error, "No element found". I'm not sure what I did between then and now, but I just can't figure this one out.

This is my first time using PHP and AJAX, so I'm not sure where or what the error is. Any help would be appreciated!

The exact error:

Timestamp: 4/13/2013 1:59:18 PM
Error: no element found
Source File: file:///C:/wamp/www/ajax.php
Line: 84, Column: 3
Source Code:
?>

Answer 1

If I cannot help you solve this issue, I will delete this answer, but I wanted to post it like this so you can better read my suggestions.

Start by changing your HandleResponse function to this:

function HandleResponse(response)
{
  console.log(response);
  document.getElementById('ResponseDiv').innerHTML = response;
}

and post the result that appears above the error, in firebug.

What we are doing here is adding a way for us to see if any data was actually returned from the AJAX request. A call to console.log tells the browser to print the given argument to the console (in your case, firebug).

UPDATE 1

In your comments, you stated that nothing displayed when you logged the value of response. This means that you received nothing back from the server (in terms of data, at least).

My next suggestion is that you change the call to MakeRequest to the following:

<input type='button' id="test" onclick='MakeRequest("*");' value='Global Highscore Table'/>

Like before, leave the console.log line in the HandleResponse method, and post the result that appears above the error in firebug.

Here, we are setting your MakeRequest to make a request that passes a wild-card query parameter. At the time of this suggestion, I did not realize that the requested file expected two arguments, nor that passing a wild-card would error the script. However, this was still a good thing to do, as we found a new error, which tells us that the request is being received.

UPDATE 2

Now, cut and paste everything from your "ajax.php" file to your notepad or another, similar application. Then, set the following to be the only content of the "ajax.php" file:

<?php echo "Request received and response sent"; ?>

Again, post the result of the console.log.

Here, we are taking a step back from fixing the complex code, and we are going back to the basics. All we want to do, here, is verify that we can both send the request and receive a response.

If "Request received and response sent" is successfully returned as the response of the request, then we know that the error lies in ajax.php, and not in the request. If it is not, we know that there is a problem with the request (be it a server issue or the request, itself). If the latter is the case, there could still be a problem with ajax.php, but we must first fix the request.

UPDATE 3 (final solution)

Issue was found to be due to not correctly running on the local server.