Simple AJAX and PHP - just checking if a file exists (doesn't work in IE6)

[davil]

I found a great client side image resize solution:

http://www.resize-before-upload.com/

 

but the free version doesn't have form integration, so I copied some ajax code off the internet and integrated it into my PHP - so it just keeps checking for a specific file to be uploaded and then the PHP just echos 'success' and if the ajax sees that it redirects to another page to continue the process

 

Here's the JS (Jquery obviously)

$(document).ready(function()
{
   //filecheck.php is called every 2 seconds to ask server if file has been uploaded yet
   var refreshId = setInterval(function()
   {
   $('#Davfilecheck').load('scripts/filecheck.php');
   
   var fc1 = new String();
   fc1 = document.getElementById('Davfilecheck').innerHTML;

if (fc1 == "Success!"){
alert ("The photo has been successfully uploaded to the site. Click OK to enter details for photo");
window.location="index.php?locate=upload&filedone=yes";
}


   }, 2000);

});

 

And here's the 'filecheck.php' code

<?php
if (file_exists('../secure/uploads/uploadfile')){echo "Success!";}
?>

 

This system works great with most newer browsers but when the file is uploaded in IE6 the JS doesn't seem to notice.

 

I will upload my main PHP script if necessary but I'm pretty sure this is the part that won't work in IE6.

 

Is the only option to ask the users to upgrade browser or is there a hack for getting this to work in IE6 ?

 

My PHP coding is a lot better than my JS coding. :-D

[davil]

anyone ??? bump :-(

[JustLikeIcarus]

Try it this way.  The random number is needed because IE likes to cache pages it "thinks" are the same.  Also I didnt set the inner html of the div. But that can be done by adding $('#Davfilecheck').html(data); to the function.

$(document).ready(function()
{

filecheck();

});

function filecheck(){
  var randomnumber=Math.floor(Math.random()*11)
  $.get('scripts/filecheck.php', {rand: randomnumber}, function(data) {
    if (data == "Success!"){
      alert ("The photo has been successfully uploaded to the site. Click OK to enter details for photo");
      window.location="index.php?locate=upload&filedone=yes";
    }
  };
  setTimeout('filecheck()', 2000);
}

[davil]

Thanks Icarus. I'll give that a go. I did almost get it working today by enabling XMLHTTPRequest properly before my code, but I'm aware that the way I was doing things is bad bad bad.... I'm not that hot at JS, PHP's my language... but I'll get there.

[davil]

sorry I just tested that new code and now it doesn't work in newer browsers either (tested in Google Chrome) - so I'll be reverting to original for the moment. However, it's probably something I neglected to do, I didn't fully understand what you meant by "I didnt set the inner html of the div , that can be done by adding $('#Davfilecheck').html(data); to the function. " perhaps you could explain a bit further ? sorry....

[JustLikeIcarus]

Woops left out a closing parenthesis

 

$(document).ready(function()
{

filecheck();

});

function filecheck(){
  var randomnumber=Math.floor(Math.random()*11)
  $.get('scripts/filecheck.php', {rand: randomnumber}, function(data) {
    if (data == "Success!"){
      alert ("The photo has been successfully uploaded to the site. Click OK to enter details for photo");
      window.location="index.php?locate=upload&filedone=yes";
    }
  });
  setTimeout('filecheck()', 2000);
}

 

What i meant is that in your original code you we setting the contents of #Davfilecheck to what the php file check was returning.  In this version I didnt do that.

[davil]

Ah! Great stuff. will test as soon as I get home. Thanks again.

[davil]

Ah it's still not budging :-(

I must see if I can debug what's going on here

 

[edit] ahah I see what I've done wrong now. filecheck.php isn't actually the real filename, I need to change that, d'oh!!!  will re-test now[/edit]

[davil]

Ah tis working! I have no way of testing in IE6 until tomorrow since I upgraded to win7 at home and I can't do XP mode because my CPU doesn't support. will test tomorrow though. I'm confident it should work.

[davil]

Ok it seems to be working now (nearly finished). Previously I had to add this code to get IE6 to play ball:

if (!XMLHttpRequest) {
  window.XMLHttpRequest = function() {
    return new ActiveXObject('Microsoft.XMLHTTP');
  }
}

 

but since your code changes, I no longer need that piece of code (weird!) - anyhow, it's working all but for one small issue:

depending on the timing of when you click upload, the window.location redirect might happen a second time, which plays havoc with my PHP code, which expects to be run once (it copies the original upload file elsewhere and deletes it at the very start, so when looped it can't find the file)

 

I could do some sort of $_SESSION hack with a variable like 'stayput' or something, but there must be a better way to do this??

 

I'm so close now I can almost taste it. :-D