Different results from safari, ie and chrome!

kamputty · 03-06-2009, 06:55 PM

Hi all!

I'm creating some AJAX POC's here at work, and I've run across this issue; but first, this is what I'm POC'ing...

#1. Create a html page that used Javascript to connect to my backend via AJAX and get the data it needs. This I have working in a limited fastion.

#2. I need to stream the data back to me, like "server says '1'", then "2" etc until it says 100.

#3. So I created a simple script that I call from the browser to test this "streaming"

This is the sample code

Code:

#!/usr/bin/perl
$| = 1;
print "Content-type: text/html\r\n\r\n";
print "<html>";
print "<head>";
print "<title>Callback Test #1</title>";

print '<meta content="no-cache" http-equiv="pragma"/>';
print '<meta content="-1" http-equiv="expires"/>';

print "</head>";
print "<body>";
print "<div id='myData'>";
print "Empty!";
print "</div>";

for($i=0;$i<10;$i++)
{
    print "<script language='JavaScript'>\r\n";
    print "document.getElementById('myData').innerHTML='Counter is [$i]';\r\n";
    print "</script>\r\n";
    sleep(1);								     
}

print "</body>\n";
print "</html>\n";

On Firefox, I see the numbers 0~9 being displayed (

)
On Safari and Chrome, it just shows the last one, but does wait the correct time...

I would guess that they are not processing the javascript tags realtime?

This is the sample "backend" I will use in my AJAX demo...

Thoughts?

~Kam (^8*

abduraooft · 03-07-2009, 07:44 AM

Could you post the parsed output(html+javascript) taken from browser's view source option?

kamputty · 03-09-2009, 05:22 PM

Here is the output when it is all done

Code:

<html><head><title>Callback Test #1</title><meta http-equiv="Pragma" content="no-cache"/><meta http-equiv="Expires" content="-1"/></head><body>Version 1.1.0<br><br><br><div id='myData'>Empty!</div><script language='JavaScript'>
document.getElementById('myData').innerHTML='Counter is [0]';
</script>
<script language='JavaScript'>
document.getElementById('myData').innerHTML='Counter is [1]';
</script>
<script language='JavaScript'>
document.getElementById('myData').innerHTML='Counter is [2]';
</script>
<script language='JavaScript'>
document.getElementById('myData').innerHTML='Counter is [3]';
</script>
<script language='JavaScript'>
document.getElementById('myData').innerHTML='Counter is [4]';
</script>
<script language='JavaScript'>
document.getElementById('myData').innerHTML='Counter is [5]';
</script>
<script language='JavaScript'>
document.getElementById('myData').innerHTML='Counter is [6]';
</script>
<script language='JavaScript'>
document.getElementById('myData').innerHTML='Counter is [7]';
</script>
<script language='JavaScript'>
document.getElementById('myData').innerHTML='Counter is [8]';
</script>
<script language='JavaScript'>
document.getElementById('myData').innerHTML='Counter is [9]';
</script>
</body>
</html>

~Kam (^8*

abduraooft · 03-09-2009, 05:30 PM

OK, try

Code:

 print "document.getElementById('myData').innerHTML+='Counter is [$i]';\r\n";