Monday, July 29, 2013

AJAX Call: working in IE9, but not in Firefox and Chrome

Recently, I'm working on login functionality for a webapp where login form in the header and the user has to stay on the same page after logging in.

In order to solve problem, I have to use Ajax. After couples of days working on the Ajax function, I finally got it work the way I wanted it.

However, I ran into a weird error. The Ajax call is working on IE9 only, not in Firefox nor Chrome!
Here is the screenshot of the log in form.



In IE9, when login button is clicked, the form will fade away, but it stay there in Firefox/Chrome.
After first, I thought there was something wrong with my submit button. I tried several ways to call the submit action/event, but they were not working. The problem persisted.

It turned out the solution is quite simple: prevent default behavior for Ajax needs to be turned off!
For some reason, IE9 turns it off when it recognized JSON object, but Firefox/Chrome require the turning off explicitly to be specified in AJAX call.


After this fix, my AJAX log in form works cross browers like a charm!






No comments:

Post a Comment