I have a page that loads 2 drop down menu with AJAX. Then it loads a third AJAX that can take over 30 seconds to load. (slow SQL query).
When user selects items from the 2 drop downs the third slow AJAX is fired again to list the results.
All works fine on first load. But if I refresh the page or if user selects a different option while the third ajax is still loading, the page hangs until the third ajax has been loaded.
I have tried to .abort() the load, but that does not seem to help. The browser waits for the aborted file to load before loading ajax 1&2 and 3.
I added the abort to onbeforeunload but that does not help the page refresh problem.
I have tried this using pure JavaScript and jQuery but get same results.
The server is IIS6 and the XML output is from asp pages.
Is there any way to get around this?
Abort Ajax requests using jQuery
This should help you in aborting the ajax call. Just check on which ajax call you are actually calling abort() function.
On the side note, just check whether your browser is getting hung because of other processes running in your system. Because, every ajax request that is fired will start a db query and that may also give you a hung feel.
Related
I am debugging an application that has several Ajax calls on setIntervals on different pages. I am having a hard time debugging because since the pages keep refreshing every 5 seconds I don't have enough time to inspect the DOM. If I find the class or ID used to make the AJAX i can delete it on the browser inspector and stop the AJAX. However, this is a large application and I don't know every single class or ID used to make the AJAX call on every page. It is really time-consuming to look for them. All that said, is there a native tool on the browser that allows to disable AJAX? As suggested on another post, I ran this function on the console to override the AJAX but it didn't work:
XMLHttpRequest.prototype.call = function () {};
Thank you.
I am using jqgrid for my app and it works fine, I just have problem when the jqgrid gets 2 different ajax calls one by one but fast, I want it to just relate to the second ajax call, but it freaks out. Someone have an idea to resolve this?
i can't give a peek on the code, but i mean that he try to reload the data and meanwhile i press anther button and want him to reload anther data instead. i look at Fiddler and the 2 ajax calls gets fine
Kill the first request as a part of your second call. See Abort Ajax requests using jQuery as an example of killing an Ajax request.
Situation
In my Wicket application, I have a page which contains two tags. Each time a tab is selected, its content is fetched via Ajax so that every time you switch to a different tab its content it loaded fresh from the server.
On one of the tabs I have an input field which has an onblur event which saves the contents of the field via Ajax.
Problem
If the focus is on the input field and I click to a blank area of the page, the Ajax request it fired and the data saved.
If, instead of clicking on a blank area of the page, I click on the other tab, the Ajax request to save the input field is fired but not the Ajax request to switch tabs.
Is the number of concurrent Ajax requests limited in Wicket to one?
Yes, concurrent requests to a page instance are limited to one. Wicket Ajax will queue subsequent Ajax requests in the client side channel. See the wicket Ajax debugger for details in your running application.
This is done to make building your application easier: no need to work around concurrency issues on the server. Page access is always one done from one single thread: the current active request thread. If we didn't do this, we would have to synchronize on the component tree and make the whole programming model go yuk.
The problem was our AjaxIndicator which overlays a DIV over the entire page for the duration of each Ajax request. The "mouseup" (and consequently "click") events arrived when the overlay was in place, and thus lost. By holding the mouse button down and releasing it after the first Ajax request had completed and overlaying DIV removed, the second ajax request was fired.
It seems obvious now as the whole reason why we have such an overlay is to prevent users clicking while an Ajax request is running.
I think my solution will be to disable the ajax indicator on certain, very quick requests such as these where it makes no sense to have an indicator (disregarding the potential that requests could take much longer in case of unusually high server load).
May be the response of the onblur ajax request may have error or the process you are performing after the ajax response may have error.
If possible can you paste the code sniplet.
The problem is this:
When I change the content on a page via AJAX and then use the browsers back and forward button to go to the same page, then I will be presented with the content of the page before the AJAX was executed.
This seems to be specific to IE (confirmed on version 8), as Firefox will render the last version of the page.
Just to clarify, I don't need (nor want for usability reasons) to replay the AJAX calls when clicking back/forward.
We were thinking about firing the last AJAX call on page load (if that event is even triggered), but we would like not to force everyone to wait through the additional AJAX call when going to the page the second time, also this would cause the first real load of the page to be slower as well.
Maybe someone has a good solution for this?
I think it will be useful : http://www.ibm.com/developerworks/library/os-php-rad2/ ;)
I am a beginner using ajax and I always thought that it is completely asynchronous. But I discovered that a call can be interrupted by a page reload or a page change (like clicking on a hyperlink). I was under the impression that when an ajax call is started, it is carried out no matter what the browser does afterwards. Is that wrong?
Now to the specific problem I am having: think of an online test where users answer questions (by typing into textboxes). When a textbox loses focus, an ajax call is triggered which persists the value of the textbox to a DB. That works well when changing between textboxes. However, I also have a submit button which triggeres a post action to another page (it is the submit button). When I enter something into a textbox and click on the button afterwards, the call is not carried out. Moreover, when I type into a textbox, click somewhere else (also triggering the call) and swiftly click on the submit button, the call is also not made. Is that expected behaviour?
The reason I am using ajax in the first place is to persist the values so when something unforseeable happens, like a browser crash, the already typed in text is already saved.
Is my way of thinking wrong? How would you go about solving this problem?
Thank you for your time!
AJAX is asynchronous.
When you send an AJAX request the javascript engine sends it off and sets up a handler for the response.
However, if you send an AJAX request to the server and then navigate away from the page before it is received, nothing will happen. Why? Because with each page load the entire Javascript environment is tore down and reinitialized, it has no idea what happened on the last page.
For your problem I would intercept the form submit action and do whatever you need to do with the data, and then submit the form.
Edit: In response to your comment. You are correct. If the ajax request is sent, and you're not depending on it's return value, then it should not matter.
I'd suggest debugging your problem with Firebug to see if the AJAX call is really being sent properly, and to confirm your server is properly processing it.
Unless you do something special with persistent local storage, all javascript and ajax calls are blown away when a new page is loaded over the current page. Also when a submit is done on a form.
To save things intra-page, save the data asap. Eg, perhaps save on key-up, perhaps periodically with a timer, not just on lose-focus.
Re submitting the page: change the on-click behavior to first store, then to go to a new page.
All of the effects that you are seeing are normal.
Also, be sure to test on both slow (ie 6 or 7) and fast browsers (chrome)