IE Issue

[jdadwilson]

I have a site (www.txfannin.org) for searching family genealogy. The backend allows volunteers to enter information into the database and thus available to the users.

The volunteers using IE experience a problem that others do not. Here is the scenario...

In the admin module a record is loaded by entering an ID and selecting the "Display" button.
Via javascript and an ajax call the record is read from the database and displayed in the edit fields.
User makes the necessary change to the record and selects the "Edit" button.
Via javascrpt and an ajax call the record is updated in the database.
User via a separate IE browser tab displays the record to verify that the information is as desired.
If not as desired, the user returns to the initial tab and reloads the record by entering the ID and selecting the "Display" button.
THE DISPLAYED RECORD DOES NOT REFLECT THE INFORMATION ENTERED IN THE EDIT, BUT IT IS REFLECTED IN THE MAIN AREA.

Does anyone have a clue as to why this is happening, AND how to correct it?

TIA
jdadwilson

[jscheuer1]

It would probably depend upon the version of IE in use and also possibly its settings.

"Via javascript and an ajax" - AJAX is conducted differently in IE than in other browsers. Starting with IE 7 I think MS started to normalize this, but not all AJAX code takes advantage of that. Even with IE 11 where there's virtually no way of knowing that the browser is IE, some older AJAX code might still try taking the non-standard path. So much more so with IE 7 through 10. IE 6 can do AJAX, but there it must follow the IE proprietary path if it's to succeed.

So, although this may have nothing to do with the problem, you can see the potential. Similarly, in IE there are numerous processes that used to require proprietary code that now in more recent versions are better handled, and/or can only be handled using standard methods. Not all code is equal at recognizing those sorts of situations. Hence, sometimes a particular version of IE will "fall down".

In light of these facts, I think you can see there is no way to know just what the particular problem(s) is/are without seeing the pages involved.

Now I know you linked to a page, but it's unclear to me what I have to do on it to see the problem, and in fact - the way you have presented this issue leads me to believe that I might need special access to even be able to see the problem.

"DOES NOT REFLECT THE INFORMATION ENTERED"

Where would I enter said information?

[jdadwilson]

John,

Thanks for the reply. The volunteer is using IE 11. Yes, the problem is happening in the backend admin area. Special access is required. I personally think the solution is for the volunteer to switch browsers since it is a lot of work to find and solve the problem in IE when it is not a problem in other browsers.

Again, thanks.
jdadwilson

[jdadwilson]

John,

I found this article which exactly states my issue.

IT World Article

I just need to determine what is the best solution for my code.

Again thanks for all your assistance
jdadwilson

[jscheuer1]

OK, I'm familiar with that. The solution is to not allow IE to cache the requested page. I see that on the page you linked to that it was using jQuery for AJAX. I have no way of knowing whether or not that's also the case with the AJAX request that you're talking about (the one I would need special access to make, and that seems to be the problem). But if it is, just add cache: false to the properties for the request. Example from txfannin.org/files_java/jquery.dataTables.tableTools.2.2.1-dev.js:

	"ajax": $.extend( {}, TableTools.buttonBase, {
		"sAjaxUrl": "/xhr.php",
		"sButtonText": "Ajax button",
		"fnClick": function( nButton, oConfig ) {
			var sData = this.fnGetTableData(oConfig);
			$.ajax( {
				"url": oConfig.sAjaxUrl,
				"data": [
					{ "name": "tableData", "value": sData }
				],
				"success": oConfig.fnAjaxComplete,
				"dataType": "json",
				"type": "POST",
				"cache": false,
				"error": function () {
					alert( "Error detected when sending table data to server" );
				}
			} );
		},
		"fnAjaxComplete": function( json ) {
			alert( 'Ajax complete' );
		}
	} ),

In the above example, the cache is already set to false. So I'm pretty sure that's not the code that's giving you the problem.

One can also set the global jQuery AJAX cache property to false and that will work for any jQuery AJAX code on the page using that instance of jQuery as long as it doesn't specifically specify cache: true:

jQuery.ajaxSetup({
	cache: false
});

A good place for that would be here (addition highlighted):

<![endif]--><!--Load the primary javascripts for all pages -->
<script type="text/javascript" src="//code.jquery.com/jquery-1.10.2.min.js"></script>
<script type="text/javascript">
jQuery.ajaxSetup({
	cache: false
});
</script>
<script type="text/javascript" src="//code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<script type="text/javascript" src="files_java/jquery.dataTables.1.09.4.min.js"></script>
<script type="text/javascript" src="files_java/jquery.dataTables.tableTools.2.2.1-dev.js"></script>
<script type="text/javascript" src="files_java_mine/site_functions.js"></script>
<script type="text/javascript" src="files_java/jquery.functions.js"></script>
<script type="text/javascript" src="files_java/sideBarMenu.js"></script>
<script type="text/javascript" src="files_java/equalcolumns.js"></script>

</head>

But, if the specific jQuery AJAX call specifies cache true, or the global setting is changed to true after the above and before the actual AJAX call, or if the AJAX call that is causing the problem is not using jQuery AJAX, there will still be a problem. Oh, and if there is another version of jQuery loaded before the AJAX call, that can revert the global to cache: true.

If you want more help, let me see the specific code that's causing the problem.

[jdadwilson]

Thanks again for the response...

As a quick test I added the date code as a parameter to the get call. I'll look at your solutions to see how they might best fit into my code structure.

jdadwilson

[jscheuer1]

Is the get call made via jQuery?

[jdadwilson]

jQuery it is...

$.get( 'files_commands/get_Interment.php?recID=' + GenWebNum + '&noCache='+new Date().getTime(), 'limit=1', loadInt);

jdadwilson

[jscheuer1]

What you have there might work, but it's a little confused looking. The second parameter for $.get is supposed to be an object or string with the data for the request. What you have is data with the url and a string ('limit=1') as additional data. This is more in keeping with the documented usage:

$.get( 'files_commands/get_Interment.php', {recID: GenWebNum, noCache: new Date().getTime(), limit: 1}, loadInt);

Or:

$.ajaxSetup({cache: false});
$.get( 'files_commands/get_Interment.php', {recID: GenWebNum, limit: 1}, loadInt);

Either should work. And there are other variations which would also adhere to the documented usage.

The browser cache may need to be cleared and/or the page refreshed to see changes.

For the documentation on $.get, see:

http://api.jquery.com/jQuery.get/