I am attempting to make a very simple AJAX/PHP/MYSQL rating system consisting solely of likes and dislikes. My biggest problem is that I am terrible at Ajax.
Basically I want to pass the id of the story to the PHP script which is called by the AJAX object. At the moment I am returned to the index.html page with no ratings being incremented and none of my javascript alerts saying anything. I think part of the problem is I have no idea how I can debug it.
Anyway here are the scripts:
PHP upratings.php script:
//db connection first
$id = mysqli_real_escape_string($link, $_GET['id']);
$sql = "UPDATE story SET
likes = likes +1 WHERE id = '$id'";
$result = mysqli_query($link, $sql);
if (!$result)
{
$error = 'There appears to have been a problem.';
include 'error.html.php';
exit();
}
exit();
Here is the javascript:
function getXMLHttpRequest()
{
var request = false;
if(window.XMLHttpRequest)
{
request = new XMLHttpRequest();
} else {
if(window.ActiveXObject)
{
try {
request = new ActiveXObject("Msml2.XMLHTTP");
}
catch(err1)
{
try{
request = new ActiveXObject("Microsoft.XMLHTTP");
}
catch(err2)
{
request = false;
}
}
}
}
return request;
}
function responseAjax() {
if(voterequest.readyState == 4) {
document.getElementById('waiting').innerHTML = '';
if(voterequest.status == 200) {
alert("Thanks for your vote!" + voterequest.responseText);
} else {
alert("Something appears to have gone wrong " + voterequest.statusText);
}
} else {
document.getElementById('waiting').innerHTML = 'ajax-loadingimage';
}
}
var voterequest = getXMLHttpRequest();
function callstoryAjaxup() {
var url = "upratings.php";
var random_number = parseInt(Math.random()*999999999);
voterequest.open("GET", url + "&id=" + <?php echo $_GET['id']; ?> + "&rand=" + random_number, true);
voterequest.onreadystatechange = responseAjax;
voterequest.send(null);
}
And here is the form as it appears on my page:
<form name="voting">
<input type="hidden" name="id" value="<?php htmlout($story['id']); ?>">
<input type="submit" onclick="callstoryAjaxup()"value="Vote Up">
<input type="submit" name="action" onclick="callstoryAjaxdown()" value="Vote Down">
</form>
Any help would be so appreciated I think I’ll cry this has been bugging me for over a month now!