Advertisement

03.19.2008 at 11:33AM PDT, ID: 23254688 | Points: 100
[x]
Attachment Details
Differences in async parameter across browsers
Zones: JavaScript, Internet Explorer Web Browser, Firefox Web Browser
Tags: Java Script, AJAX, IE, Firefox
Issue: The user makes some changes and then presses the browser's Refresh /Reload button on an AJAX-enabled page.  The page implicitly does an AJAX save in the background, but the form data gets submitted after the page was reloaded.  This causes the user to believe that his/her changes were lost.

To avoid this I modified the AJAX save code to do an automatic reload when readyState changed to 4.
But IE did not fire this event when the async parameter (in the xmlhttp.open method) was set to true (true => synchronous).  If I set it to false, IE would work, but Firefox would not.  Any ideas on what could I be going on here?

For now to get around this problem I set a variable async to true/false (see code snippet), based on how xmlhttp was initialized (thereby going for browser detection).  I don't trust this workaround and would appreciate a more elegant solution.

EDIT: Found that Firefox does not fire event onreadystatechange when async is set to false.
1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
21:
22:
23:
24:
25:
26:
27:
28:
29:
30:
31:

function saveAJAX(){
    var xmlhttp = false;
    var async = false;
    /*@cc_on @*/
    /*@if (@_jscript_version >= 5)
    // JScript gives us Conditional compilation, we can cope with old IE versions.
    // and security blocked creation of the objects.
     try {
      xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
     } catch (e) {
      try {
       xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
      } catch (E) {
       xmlhttp = false;
      }
     }
    @end @*/
    if (!xmlhttp && typeof XMLHttpRequest!='undefined') {
      xmlhttp = new XMLHttpRequest();
      async = true;
    }
 
    xmlhttp.open("post", getAttribute(sForm, "action"), async);
    xmlhttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded; charset=iso-8859-1");
    xmlhttp.onreadystatechange=function(){
		if (xmlhttp.readyState==4) {
			document.location.reload();
		}
    }
    xmlhttp.send(getFormData());
}
Start your free trial to view this solution
Question Stats
Zone: Programming
Question Asked By: rb79
Question Asked On: 03.19.2008
Participating Experts: 2
Points: 100
Views: 0
Translate:
Loading Advertisement...
03.28.2008 at 09:12PM PDT, ID: 21235505
Hube02:

All comments and solutions are available to Premium Service Members only.

Start your 7 day free trial and see for yourself why Experts Exchange is the easiest and most proven technology resource in the world. Get Started

Already a member? Login to view this solution.

 
03.28.2008 at 09:40PM PDT, ID: 21235560

Rank: Master

Kravimir:

All comments and solutions are available to Premium Service Members only.

Start your 7 day free trial and see for yourself why Experts Exchange is the easiest and most proven technology resource in the world. Get Started

Already a member? Login to view this solution.

 
03.29.2008 at 07:05AM PDT, ID: 21236576
Hube02:

All comments and solutions are available to Premium Service Members only.

Start your 7 day free trial and see for yourself why Experts Exchange is the easiest and most proven technology resource in the world. Get Started

Already a member? Login to view this solution.

 
03.29.2008 at 07:52AM PDT, ID: 21236758
rb79:

All comments and solutions are available to Premium Service Members only.

Start your 7 day free trial and see for yourself why Experts Exchange is the easiest and most proven technology resource in the world. Get Started

Already a member? Login to view this solution.

 
03.29.2008 at 07:05PM PDT, ID: 21239209

Rank: Master

Kravimir:

All comments and solutions are available to Premium Service Members only.

Start your 7 day free trial and see for yourself why Experts Exchange is the easiest and most proven technology resource in the world. Get Started

Already a member? Login to view this solution.

 
03.30.2008 at 08:02AM PDT, ID: 21240911
rb79:

All comments and solutions are available to Premium Service Members only.

Start your 7 day free trial and see for yourself why Experts Exchange is the easiest and most proven technology resource in the world. Get Started

Already a member? Login to view this solution.

 
 
Loading Advertisement...
Microsoft
  • Internet Protocols
  • Applications
  • Development
  • OS
  • Hardware
  • Windows Security
Apple
  • Operating Systems
  • Hardware
  • Programming
  • Networking
  • Software
Internet
  • Search Engines
  • File Sharing
  • WebTrends / Stats
  • Spy / Ad Blockers
  • Web Browsers
  • New Net Users
  • Web Development
  • Chat / IM
  • Anti Spam
  • Web Servers
  • Anti-Virus
  • Email Clients
Gamers
  • Tips
  • Online / MMORPG
  • Puzzle
  • Emulators
  • Action / Adventure
  • Role Playing
  • Consoles
  • Game Programming
  • Strategy
  • Sports
  • Misc
  • Computer Games
Digital Living
  • Hardware
  • New Net Users
  • New Users
  • Software
  • Digital Music
  • Gaming World
  • Home Security
  • Apple
  • Networking Hardware
Virus & Spyware
  • Vulnerabilities
  • IDS
  • Encryption
  • Anti-Virus
  • Operating Systems Security
  • Software Firewalls
  • WebApplications
  • Cell Phones
  • Operating Systems
  • Internet
  • Hardware Firewalls
Hardware
  • Handhelds / PDAs
  • Displays / Monitors
  • Components
  • Networking Hardware
  • Peripherals
  • Laptops/Notebooks
  • Storage
  • Servers
  • Desktops
  • New Users
  • Misc
  • Apple
Software
  • System Utilities
  • Industry Specific
  • Network Management
  • Photos / Graphics
  • Page Layout
  • VMWare
  • Misc
  • Web Development
  • OS
  • CYGWIN
  • Voice Recognition
  • Message Queue
  • Quality Assurance
  • Security
  • Firewalls
  • MultiMedia Applications
  • Development
  • Database
  • Office / Productivity
  • Business Management
  • OS/2 Apps
  • Server Software
  • Internet / Email
ITPro
  • OS
  • Storage
  • Encryption
  • Operating Systems Security
  • Apple Hardware
  • Laptops & Notebooks
  • Servers
  • Networking Hardware
  • Peripherals
  • Devices
  • Displays / Monitors
  • WebTrends / Stats
  • Search Engines
  • Firewalls
  • WebApplications
  • IDS
  • Vulnerabilities
  • Email Clients
  • File Sharing
  • Spy / Ad Blockers
  • Web Browsers
  • Web Servers
  • Networking
  • Anti-Virus
  • Chat / IM
  • Anti Spam
Developer
  • Web Servers
  • Web Browsers
  • Game Programming
  • Dev Tools
  • Industry Specific
  • Office / Productivity
  • Database
  • CYGWIN
  • Web Development
  • Search Engines
  • File Sharing
  • WebTrends / Stats
  • Programming
  • Content Management
  • Application Servers
  • Protocols
Storage
  • Removable Backup Media
  • Storage Technology
  • Servers
  • Grid
  • Remote Access
  • Backup / Restore
  • Misc
  • Hard Drives
OS
  • Miscellaneous
  • Security
  • Development
  • Linux
  • VMWare
  • MainFrame OS
  • Unix
  • Apple
  • OS / 2
  • AS / 400
  • BeOS
  • Microsoft
  • VMS / OpenVMS
Database
  • Oracle
  • Miscellaneous
  • MySQL
  • Software
  • Sybase
  • Contact Management
  • PostgreSQL
  • Data Manipulation
  • Clarion
  • InterSystems Cache
  • Siebel
  • MUMPS
  • OLAP
  • SQLBase
  • SAS
  • GIS & GPS
  • 4GL
  • Berkeley DB
  • DB2
  • Informix
  • Interbase / Firebird
  • FoxPro
  • Reporting
  • LDAP
  • Filemaker Pro
  • MS SQL Server
  • dBase
  • MS Access
Security
  • Misc
  • Web Browsers
  • Software Firewalls
  • Operating Systems Security
  • File Sharing
  • Spy / Ad Blockers
  • Vulnerabilities
  • WebApplications
  • IDS
  • Anti-Virus
  • Encryption
  • Anti Spam
  • Email Clients
  • VPN
  • Chat / IM
Programming
  • Editors IDEs
  • Installation
  • Handhelds / PDAs
  • Multimedia Programming
  • System / Kernel
  • Algorithms
  • Game
  • Signal Processing
  • Project Management
  • Open Source
  • Database
  • Misc
  • Languages
  • Processor Platforms
  • Theory
Web Development
  • Scripting
  • Blogs
  • Web Servers
  • Software
  • Search Engines
  • Web Graphics
  • Images
  • Internet Marketing
  • Images and Photos
  • Components
  • Document Imaging
  • Web Languages/Standards
  • Illustration
  • WebApplications
  • Fonts
  • WebTrends / Stats
  • Authoring
  • Digital Camera Software
  • Miscellaneous
Networking
  • Protocols
  • Apple Networking
  • Network Management
  • Message Queue
  • Application Servers
  • Content Management
  • File Servers
  • Email Servers
  • Misc
  • Java Editors & IDEs
  • Wireless
  • Networking Hardware
  • Backup / Restore
  • System Utilities
  • ISPs & Hosting
  • Web Servers
  • Storage Technology
  • Removable Backup Media
  • Servers
  • Broadband
  • Grid
  • OS / 2
  • Novell Netware
  • Unix Networking
  • Windows Networking
  • Security
  • Telecommunications
  • Operating Systems
  • Linux Networking
Other
  • Community Advisor
  • Lounge
  • Community Support
  • New Net Users
  • Philosophy / Religion
  • Math / Science
  • Miscellaneous
  • URLs
  • Expert Lounge
  • Politics
  • Puzzles / Riddles
Community Support
  • Suggestions
  • New to EE
  • New Topics
  • Community Advisor
  • CleanUp
  • Announcements
  • General
  • Feedback
  • Input
  • EE Bugs
 
03.28.2008 at 09:12PM PDT, ID: 21235505
Hube02:
Don't know if you're still looking for help, or even if my suggestion will help.

It appears that your code has the part that creates the XMLHttpRequest object in IE 6 or older turned off (commented out) And to be honest I don't even know if what is there would work.

Below is what I use for creating the XMLHttpRequest object. I got it out of a book and it seems to always work.

1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
21:
22:
23:
24:
25:
26:
27:
28:
29:
30:
31:
32:
33:

  function ajax_createXmlHttpRequestObject() {
    // create new XMLHttpRequest Object
    xmlHttp == false;
    // will store the reference to the XMLHttpRequest object
    // this should work for all browsers except IE6 and older
    try {
      // try to create XMLHttpRequest object
      xmlHttp = new XMLHttpRequest();
    }
    catch(e) {
      // failed to create XMLHttpRequest object
      // assume IE6 or older
      var XmlHttpVersions = new Array("MSXML2.XMLHTTP.6.0",
                                      "MSXML2.XMLHTTP.5.0",
                                      "MSXML2.XMLHTTP.4.0",
                                      "MSXML2.XMLHTTP.3.0",
                                      "MSXML2.XMLHTTP",
                                      "Microsoft.XMLHTTP");
      // try every prog id until one works
      for (var i=0; i<XmlHttpVersions.length && !xmlHttp; i++) {
        try { 
          // try to create XMLHttpRequest object
          xmlHttp = new ActiveXObject(XmlHttpVersions[i]);
        } 
        catch (e) {}
        // failed to create object
        // do nothing and try the next
      }
    }
    // return the object
    // returns false if we were unable to create any object
    return xmlHttp;
  }
Open in New Window
 
03.28.2008 at 09:40PM PDT, ID: 21235560

Rank: Master

Kravimir:
@rb79

Are you testing this via "file:///" or via "http://"?


@Hube02

That's not really a comment, it's called conditional compilation (don't confuse it with conditional comments). It's a feature of MS JScript. (Non-IE browsers will see it as a comment.)
http://www.javascriptkit.com/javatutors/conditionalcompile.shtml
http://msdn2.microsoft.com/en-us/library/ahx1z4fs(VS.80).aspx
 
03.29.2008 at 07:05AM PDT, ID: 21236576
Hube02:
Kravimir, thanks for the pointer, I've bookmarked that page to keep in the back of my mind. Quite honestly I don't know if I would ever use something like that, when it comes to code I would much rather us an if statement or error catching like the above that will be interpreted by all browsers than to write code that only works in specific browsers, just seems cleaner to me.

Still, there are several ways of creating an XMLHttpRequest object not covered in rb79's original code. As far as I know, (and I could be wrong) the code I posted includes every possible way to do it.

Then again, that might not even be the trouble, so...
 
03.29.2008 at 07:52AM PDT, ID: 21236758
rb79:
@Kravimir

We use the https protocol.
 
03.29.2008 at 07:05PM PDT, ID: 21239209

Rank: Master

Kravimir:
Have you tried this?
1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
21:
22:
23:
24:
25:
26:
27:

function saveAJAX(){
    var xmlhttp = false;
    var async = false;
    /*@cc_on @if (@_jscript_version >= 5)
    // JScript gives us Conditional compilation, we can cope with old IE versions.
    // and security blocked creation of the objects.
     try {
      xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
     } catch (e) {
      try {
       xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
      } catch (E) {
       xmlhttp = false;
      }
     }
    @end @*/
    if (!xmlhttp && typeof XMLHttpRequest!='undefined') {
      xmlhttp = new XMLHttpRequest();
    }
 
    xmlhttp.open("post", getAttribute(sForm, "action"), async);
    xmlhttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded; charset=iso-8859-1");
    xmlhttp.send(getFormData());
    if (xmlhttp.readyState==4) {
        document.location.reload();
    }
}
Open in New Window
 
03.30.2008 at 08:02AM PDT, ID: 21240911
rb79:
No, that did not work.  I had already played around with the values of the async parameter before posting this question.
 
 
20080236-EE-VQP-29 / EE_QW_2_20070628