Reputation: 10266
I have created a very basic page that retrieves all contacts from my contact
MySQL table using AJAX:
index.php
html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>mycontacts.</title>
<script type="text/javascript" src="JavaScripts/PrintContacts.js"></script>
</head>
<body>
<div class="main-wrapper">
<div id="main-content">
<script type="text/javascript">
printContacts();
</script>
<div id="contacts">
</div>
</div>
</div>
</body>
</html>
PrintContacts.js
var xmlHttp;
function printContacts() {
xmlHttp = new XMLHttpRequest();
var url = "PHP/getAllContacts.php";
// Workaround for page caching
url = url + "&sid=" + Math.round(Math.random() * 1000000000);
// Commenting the line above removes my issue but I do need this for caching!!!
// Manage XmlHttpObject state change
xmlHttp.onreadystatechange = stateChanged;
xmlHttp.open("POST", url, true);
xmlHttp.send(null);
}
function stateChanged() {
// Check if the XmlHttp request is complete
if (xmlHttp.readyState == 4) {
// Set the XmlHttp response in the div contacts
document.getElementById("contacts").innerHTML = xmlHttp.responseText;
}
}
getAllContacts.php
<?php
$dbconnection = mysql_connect("localhost", "root", "");
mysql_select_db("mycontacts", $dbconnection);
$command = "SELECT * FROM contact";
$result = mysql_query($command);
echo "<table border='1'>";
// Table headers
echo "<tr><th>Name</th></tr>";
// Print all contacts
while($row = mysql_fetch_array($result)) {
echo "<tr>";
echo "<td>" . $row['DisplayName'] . "</td>";
echo "</tr>";
}
echo "</table>";
mysql_close($dbconnection);
?>
Opening the getAllContacts.php directly returns the appropriate table with the data, however, opening index.php, results in an error:
Object not found!
The requested URL was not found on this server. The link on the referring page seems to be wrong or outdated. Please inform the author of that page about the error.
If you think this is a server error, please contact the webmaster.Error 404
localhost
12/08/2010 2:47:27 PM
Apache/2.2.14 (Win32) DAV/2 mod_ssl/2.2.14 OpenSSL/0.9.8l mod_autoindex_color PHP/5.3.1 mod_apreq2-20090110/2.7.1 mod_perl/2.0.4 Perl/v5.10.1
I found out that adding &SID= is the root of the issue. This is happening in the PrintContacts.js file. Removing that loads the page appropriately. But I DO need that in order to workaround the caching. Do you know how to resolve this?
Thanks for all the help.
When adding SID to the url (for caching purposes), it should be appended with "?sid=" instead of "&sid=". Changing this resolves the issue; it was a typo after all!
function printContacts() {
xmlHttp = new XMLHttpRequest();
var url = "PHP/getAllContacts.php";
// Workaround for page caching
url = url + "&sid=" + Math.round(Math.random() * 1000000000);
...
Upvotes: 1
Views: 3241
Reputation: 1797
When using AJAX, the url should be linked based on the browser's current location, not the location of the javascript file.
Change the url in printContacts() to just "PHP/getAllContacts.php".
EDIT: Ok... I figured it out! In the PrintContacts.js, you need to change this line
url = url + "&sid=" + Math.round(Math.random() * 1000000000);
to this...
url = url + "?sid=" + Math.round(Math.random() * 1000000000);
Note the question mark in there. Having the & made it look for a file named getAllContacts.php&192837, not a file named getAllContacts.php.
Upvotes: 1
Reputation: 1444
My guess is that your error lies here:
var url = "../PHP/getAllContacts.php";
Replace the url with either the absolute url, or something relative to the domain instead of relative to the JS file.
Upvotes: 0
Reputation: 86406
I am going to suggest only one thing
can you please use the full url instead
var url = "http://www.blahblah.com/PHP/getAllContacts.php";
Upvotes: 0