Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations Mike Lewis on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Problem with Ajax, JSon and Prototype.js in IE8 1

Status
Not open for further replies.

GPhilipp

Programmer
Apr 12, 2010
20
US
Problem with Ajax, JSon and Prototype.js in IE8

As you see in the simplified (hope I didn't break the code by simplifying) scripts below, I have setup a timer to automaticly refresh some data on my page.

The strange thing is that it works great in Chrome and FireFox, but not in IE. In IE the timer fires when it is supposed to, but the data stays the same. Putting an alert box with the string received form the server shows the old data.

Also wired, when I start a new IE session the web-page gets updated with the new data, but only one time.

What am I doing wrong?
Any help is greatly appreciated!

Gunnar.

Java Script – Client Side:
Code:
function Class_AutoLoader() {
	var request=null;

	this.InitializeAutoRefresh = function() {
		o_RefreshTimer = new PeriodicalExecuter(GetData, 2)
	}

	var GetData = function() {
		var cmd = '[URL unfurl="true"]http://(url)/PageData.php?Type=2&ID=12345';[/URL]
		request=null;
		
		request = getHTTPObject();
		request.onreadystatechange = sendData;
		request.open("GET", cmd, true);
		request.send(null);
	};

	function sendData() {
		var JSONtext = '';
		var JSONobject = '';

		// if request object received response
		if(request.readyState == 4) {
			// parser.php response
			JSONtext = request.responseText;
			// convert received string to JavaScript object
			JSONobject = JSON.parse(JSONtext);
			// notice how variables are used

			for(id in JSONobject) {
				if(id=="Time") {
					document.getElementById('test1').innerHTML = JSONobject[id]
				} else if (id=="User_Data") {
					for(id_Level2 in id) {
						if(id_Level2=="Customer") {
							document.getElementById('test6').innerHTML = JSONobject[id_Level2]
						} else if (id_Level2=="Price") {
							document.getElementById('test7').innerHTML = JSONobject[id_Level2]
						} else if (id_Level2=="Time") {
							document.getElementById('test9').innerHTML = JSONobject[id_Level2]
						}
					}
				}
			}
			id = null;
			a_Result = null;
			cmd = null;
		}
	}

function formatIntoHHMMSS(secsIn) {
	//get minutes:
	var minutes=parseInt(secsIn/60);
	//shrink:
	seconds = (secsIn%60);
	//get hours:
	var hours=parseInt(minutes/60);
	//shrink:
	minutes = (minutes%60);
	//build text:
	return (AddZero(hours) + ":" + AddZero(minutes) + ":" + AddZero(seconds));
}

function AddZero(num) {
	return ((num >= 0)&&(num < 10))?"0"+num:num+"";
}

function getHTTPObject() {
	var xhr = false;
	if (window.XMLHttpRequest) {
		xhr = new XMLHttpRequest();
	} else if (window.ActiveXObject) {
		try {
			xhr = new ActiveXObject("Msxml2.XMLHTTP");
		} catch(e) {
			try {
				xhr = new ActiveXObject("Microsoft.XMLHTTP");
			} catch(e) {
				xhr = false;
			}
		}
	}
	return xhr;
}

o_Loader = new Class_AutoLoader ();
document.observe("dom:loaded", o_Loader.InitializeAutoRefresh);

PHP Script – Server Side:
Code:
<?php
// -----------------------------------------------------------------------------
// get the passed info
$c_ID		= $_GET['ID'];
$n_Type	= $_GET['Type'];

Function GetData($c_ID, &$a_ResultData, $o_DB=NULL) {
$b_Unset_o_DB = FALSE;
	if (is_null($o_DB)) {
		$o_DB = OpenDB();
		$b_Unset_o_DB = TRUE;
	}

	$a_ResultData = array(
			  'Customer'	=> '1111111',
			  'Price'		=> '2222222',
			  'Time'	=> time());

	//
	if ($b_Unset_o_DB == TRUE) {
		CloseDB($o_DB);
		unset($o_DB);
	}
}


function GetStatus($c_ID, $o_DB=NULL) {
	$b_Unset_o_DB = FALSE;
	if (is_null($o_DB)) {
		$o_DB = OpenDB();
		$b_Unset_o_DB = TRUE;
	}

	GetData($c_ID, $JSON_array, $o_DB);

	// finalize the variable to be returned
	//$a_TempStr .= '}';
	$JSON_response = json_encode($JSON_array);

	// 
	if ($b_Unset_o_DB == TRUE) {
		CloseDB($o_DB);
		unset($o_DB);
	}
	return $JSON_response;
}



if ($n_Type == '2') {
	// refresh page
	$a_ResultData = GetStatus($c_ID, $n_LastPrice);
	echo $a_ResultData;
}
 
Hi

Sounds like a caching issue :
Code:
[b]var[/b] cmd [teal]=[/teal] [green][i]'[URL unfurl="true"]http://(url)/PageData.php?Type=2&ID=12345[/URL][highlight]&[/highlight]'[/i][/green][highlight][teal]+([/teal][b]new[/b] [COLOR=darkgoldenrod]Date[/color][teal]()).[/teal][COLOR=darkgoldenrod]getTime[/color][teal]()[/teal][/highlight][teal];[/teal]
By the way, you know that it will not work in Explorer 7 ? It has no native [tt]JSON[/tt] object. See the ECMAScript 5 compatibility table.

Feherke.
 
Hello Feherke.

First of all - Thank you for your reply.

I thought it had to do with caching, but could not figure it out. Also starnge that Chrome & FF don't behave like that.

I added you code addition to my script and its working now. Is that the answer, the correct way of doing this? - Strange.

Also, I did not know that it does not work in IE7 - havn't tested with all the browsers ( at least the popular ones).

Can you tell me what i need to do different to get this to work in IE7 (and maybe ie6, i think there are still a bunch of them out there)

Thank you so much for your help. I should have asked here first - cost me 2 days trying figure this out).

Gunnar
 
Actually, Just run this in IE7 and it workes, so i guess i am good.

Thank you again for your help!

Gunnar
 
Hi

Gunnar said:
Is that the answer, the correct way of doing this?
Theoretically the correct way should be to set the HTTP response headers so the browser not cache the it. But practically this is the way almost everybody solves it. Or very similarly, with [tt]var cmd [teal]=[/teal] [green]'[ignore]http[/ignore]://(url)/PageData.php?Type=2&ID=12345&'[/green][highlight][teal]+([/teal]nr[teal]++)[/teal][/highlight][teal];[/teal][/tt] or
[tt]var cmd [teal]=[/teal] [green]'[ignore]http[/ignore]://(url)/PageData.php?Type=2&ID=12345&'[/green][highlight][teal]+[/teal]Math[teal].[/teal]random[teal]()[/teal][/highlight][teal];[/teal][/tt].
Gunnar said:
Can you tell me what i need to do different to get this to work in IE7 (and maybe ie6, i think there are still a bunch of them out there)
I have no Explorer, so I never tried it. But taking a JavaScript library form json.org should solve the problem in older browsers.

Feherke.
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top