If aspx files are inside tabs, and only one page is loaded at a time, how can we show visual status for slow loading pages to allow users to know that that tab/page is still loading? Something like AJAX update progress would be great, even text message would be fine.
I know iframe is used in this case, and we don't show status bar at the bottom.
Thanks!
Hi Chris,
In last sample I checked if body was rendered (offsetHeight). Similar can be done to any specific element or object on page. If it is <img> with large image, then you may add a listener to its load event. If there is initialize-javascript running, then you may hack into it (add notification when it is done), etc. If there is AJAX controls on page, then you may try add handler toSys.Application.add_load(loadUrl);If there is an Infragistics control, then you may igControl.ClientSideEvents.Initialize or similar.
Brutal force way did hide that div tag, but way too early. How to make sure page is fully loaded?
I am in doubt that AJAX or our package may destroy load functionality of a target aspx located in <iframe>. Awhile ago I had some issues with submit and iframes when jquiry.js was used. I do not remember details, but anyway I could do nothing about that, because debugging of that compressed file is next to impossible. Exceptions died in the middle of it (alone with my investigations).
You may run (view in browser) that target aspx as stand alone page. I expect that onload should work.
After that create a temporary page and insert in it something like<iframe src='YourTargetUrl.aspx' width="200px" height="200px"></iframe>and check again if onload alert appears.
Next insert that <iframe> line into page where webtab is located (with all fancy js objects) and check again for onload. Etc.
Maybe you will be able to find at which point onload disappears and do something to fix that.
If nothing helps, then you may try to process other events. In worst case scenario you may use brutal force like below
<script type="text/javascript">function checkLoad(){ if(document.body && document.body.offsetHeight > 10) { window.clearInterval(fnc); loadUrl(); }}var fnc = window.setInterval(checkLoad, 200);function loadUrl(){ ...}</script>
I use client side stuff to handle this, basicly I have a div tag (not unlike ajax-progress) with a animated loading gif etc. and just load "ALL" the controls as is no target url etc. just let them fully load and then use javascript to handle the show/hide of the progress.Something likefunction ShowProgress(){ var loadingDiv = document.getElementById('loading'); if (loadingDiv){ if (loadingDiv.style.display == 'none'){ loadingDiv.style.display == ''; setTimeout(FinishedLoading, 200); } }}
function FinishedLoading() { if (navigator.userAgent.indexOf('Firefox') != -1) { document.getElementById('loading').style.display = 'none'; } else { if (document.readyState.toLowerCase() == 'complete') { document.getElementById('loading').style.display = 'none'; } else { setTimeout(FinishedLoading, 200); } }}then on page load and/or at the bottom of the page I say ShowProgress()Note i did not test the above as I just wrote it and is just "similar" to what i do, I actually have a lot more going on thanjust progress etc. but in theory this should do what you are looking for. also checking user agentis not the best way to do things but firefox never sends a readyState hence why that check is there.you might want to just throw a try catch around document.readyState if it throws a error then thebrowser is something else like firefox, netscape etc.
My problem is load event handler is never hit. Tried both onload and attachEvent (tried it on IE) without success.
I use jQuery, AJAX, AJAX TK, and your package. Any ideas?