Does AJAX - get data from database and display - work on blog sites?

[blindlemon1983]

php version - 4.4.4
mysql version - 4.1.22


Hi, my problem is rooted in how blogs handle ajax requests from a database returning html in the form of an image element. So the blog contains reference to a js file on the server which interacts with a php script in the same folder that then returns an image element (eg.

 <img src="http://www....

) to the js script that writes the code using innerHTML. Page > javascript (creation of XMLHTTPRequest object or IE equivalent) > php script > javascript > Page. The ajax request works fine when I upload a file to my server with the code in the body tag. Something goes wrong when I try pasting the same code in a Blog (that takes pure html). Basically httpRequest.readyState == 4 and httpRequest.status == 200 returns false intstead of true. Can anyone help with this problem??

[acoder]

Can you post your code or a link?

[blindlemon1983]

Here's what the javacript code looks like...
(I'm a newbie at this)

    function makeRequest(url) {
        var httpRequest;
        if (window.XMLHttpRequest) { // Mozilla, Safari, ...
        httpRequest = new XMLHttpRequest();
                var browser = "moz";
        if (httpRequest.overrideMimeType) {
            httpRequest.overrideMimeType('text/xml');
 
        }
        } 
        else if (window.ActiveXObject) { // IE
        try {
            httpRequest = new ActiveXObject("Msxml2.XMLHTTP");
                    var browser="ie";
            } 
            catch (e) {
                try {
                    httpRequest = new ActiveXObject("Microsoft.XMLHTTP");
                                    var browser="ie";
                } 
                catch (e) {}
                }
                    }
 
        if (!httpRequest) {
        alert('Giving up :( Cannot create an XMLHTTP instance');
        return false;
        }
        //Set function to handle reponse
        httpRequest.onreadystatechange = function() { alertContents(httpRequest,browser); };
        httpRequest.open('GET', url, true);
        httpRequest.send(null);
 
    }
 
    function alertContents(httpRequest,browser) {
        try{    
            if (httpRequest.readyState == 4) {
            if (httpRequest.status == 200) {
                        // Put response text (an img element) in div called 'random'
                        var newdiv = document.createElement("div");
                        newdiv.innerHTML = httpRequest.responseText;
                        var container = document.getElementById("africapic_photos");
                        container.appendChild(newdiv);
                    } else {
                        var newdiv = document.createElement("div");
                        newdiv.innerHTML = "There was a problem with the request.";
                        var container = document.getElementById("africapic_photos");
                        container.appendChild(newdiv);
 
            }
            }
        }
        catch( e ) {
            alert('Caught Exception: ' + e.description);
            }
    }
 
if (document.getElementById('africapic_hl')){
makeRequest('weblinks.php?wli=2997&size=s');}
else {
       var newdiv = document.createElement("div");
    newdiv.innerHTML = "Please use the code provided.";
    var container = document.getElementById("random");
    container.appendChild(newdiv);}
 

The output on a certain blog is "There was a problem with the request"...
Thanks

[blindlemon1983]

The code above is one of many automatically generated scripts (each passes diff values to weblinks.php. An example of the corresponding html script follows....

<div id="africapic_photos">
    <a href="http://www.africapic.com/Tranquil-pictures-2997.html" rel="nofollow" id="africapic_hl"> <script src="http://www.africapic.com/wl_js/2997.js" language="javascript"></script></a>
</div>
 

[acoder]

The output on a certain blog is "There was a problem with the request"...

So obviously the status is not 200. Have you checked what the status is?

[blindlemon1983]

It was 404. I then changed line 60 to an absolute path and now the code doesn't even reach

function alertContents(httpRequest) {
        try{    
            alert(httpRequest.readyState);
            if (httpRequest.readyState == 4) {
            alert(httpRequest.status);
            if (httpRequest.status == 200) {
                        // Put response text (an img element) in div called 'random'
                        var newdiv = document.createElement("div");
                        newdiv.innerHTML = httpRequest.responseText; 
...
 

(there are no alerts). The code works fine on my server but not on a free blog.

[blindlemon1983]

You've really got me thinking here.

[blindlemon1983]

Please can anyone help? PLeeease

[acoder]

Try accessing weblinks.php with the correct arguments without using Ajax. Does it work?

[blindlemon1983]

Yup that works. I put the image src attribute as the weblinks.php script and altered the php so that it returns an actual image not just text. The reason that I've used ajax is that if you look at post 3 line 59 there's a javascript DOM thing that's vital (it corresponds with the id on post 4 line 2) . Unless there's some way you know of to access the DOM using PHP... even that might still not work...

[blindlemon1983]

I did the above (post 10) just as a test to see that weblinks.php works fine. In order to send back an image I put a header [php]header("Content-Type: image/jpeg");[/php] Do I need to give a header for outputting text (html)? ie for this (line 6):
[php]
(code to open db connection goes here)
$query="SELECT filename,width,height,category,medianame FROM weblinks WHERE idn=".$_GET['wli']." AND size='".$_GET['size']."'";
$rawdb=mysql_query($query);
$array=mysql_fetch_array($rawdb);
if (!empty($array["filename"])){
echo "<img src='http://www.africapic.com/WebLinks/".$array['filename'].".jpg' width='".$array['width']."' height='".$array['height']."' alt='".$array['medianame']." pictures, ".$array['category']." stock photography' title='".$array['medianame']." pictures, ".$array['category']." stock photography' border='0' />";
}else{
echo "Image not retirievable";
}
mysql_close($dbh);
[/php]

[acoder]

Do I need to give a header for outputting text (html)?

No. The problem is with not being able to access the file because you're getting a status of 404 Page not found.

Check that the relative path matches. Is it in the same directory?

[blindlemon1983]

I changed the relative path to an absolute path (post 6) and the 404 disappears. However, I then get nothing (no 404 no 200 not even a readystate). Do blogs by any chance kinda block ajax requests? I'll try the code on another blog quick.

[acoder]

Do blogs by any chance kinda block ajax requests?

They shouldn't do. You did get a readyState of 4 before, so something's right.

I think the problem is with it not finding the PHP file.