File APIs for Java Developers
Manipulate DOC, XLS, PPT, PDF and many others from your application.
http://aspose.com/file-tools
The moose likes HTML, CSS and JavaScript and the fly likes how to tell when ie 7 is done rendering? Big Moose Saloon
  Search | Java FAQ | Recent Topics | Flagged Topics | Hot Topics | Zero Replies
Register / Login


Win a copy of Murach's Java Servlets and JSP this week in the Servlets forum!
JavaRanch » Java Forums » Engineering » HTML, CSS and JavaScript
Bookmark "how to tell when ie 7 is done rendering?" Watch "how to tell when ie 7 is done rendering?" New topic
Author

how to tell when ie 7 is done rendering?

Kelly Dolan
Ranch Hand

Joined: Jan 08, 2002
Posts: 109
Hi! I have a perplexing problem.

I have an application that is basically a viewer for book content in HTML form. A user can display a page of the book and use "viewer" next / previous buttons to go to the next / previous page in the book. The viewer itself is HTML and uses dojo / ajax to support its features. Sounds simple enough.

The problem...I've found that if certain pages are loaded and the user clicks the Next button right away, IE 7.0 just crashes.

Details...

Each page of the book is an HTML snippet (e.g., <div> tag that contains the content of that page).

The viewer has a <div id="pageContainer"> tag that acts as a container for the content.

When a user requests a new page be displayed, dojo is used to fetch the page (the URL of the page is known) and the result is added to the DOM. For example,

var pageContainer = document.getElementById("pageContainer");
pageContainer.innerHTML = content_returned_by_dojo_call;

The pages with which we see this problem are bigger than others.

I've tried using the debugger to identify the line of JavaScript on which the error is thrown and it is not consistent. This leads me to believe it is a timing issue.

If these pages are loaded and a bit of time is allowed to lapse before clicking the Next button, IE does *not* crash. This leads me to believe that when we see the problem, IE is still rendering the DOM and when the JavaScript tries to handle the Next button, it is accessing something that is not quite there / ready yet.

Help! How can I tell when IE is ready to continue? Or am I on the wrong track???

Thanks!
Kelly
[ June 02, 2008: Message edited by: Bear Bibeault ]
Bear Bibeault
Author and ninkuma
Marshal

Joined: Jan 10, 2002
Posts: 60766
    
  65

Is the problem that you need an Ajax call to complete on page load before the page is ready to use by the user? Or that onload is not being called until after the user starts clicking around and causing the issues?

For the former, I'd re-jigger the page to not require Ajax on page load using server-side tools (JSP et al). Or, if that's not possible, hide (or disable) the body content until it is ready for interaction.

Same with onload. The problem with onload is that it waits around for images and other stuff to load. If that takes a while, the user might be able to get in there before you've had a chance to finish setting up the page.

jQuery adds a "document ready" handler that you can use to set up the page after the DOM is rendered, but before images are loaded. I don't know if Dojo has a similar concept.


[Asking smart questions] [Bear's FrontMan] [About Bear] [Books by Bear]
Kelly Dolan
Ranch Hand

Joined: Jan 08, 2002
Posts: 109
In general, the viewer and the content displayed is one big HTML page (i.e., there are no frames). Consider the viewer loaded at this point - the onload() if any has been called and no content is displayed yet. The user will see a TOC from which he/she can choose a starting point. Let's say they choose page 4. This selection will cause a dojo call to let's say "\mybook\pages\page4.html". When the dojo call returns, the designated load function is called. For simplicitly's sake, consider this function to only contain the snippet of code I've referenced above. Once innerHTML is set, that is the end of my javascript which displays page 4. At this point the user can click on a next/prev button (not IE's back and forward button) which would result in the display of page 3 or 5. The same logic would be encountered.

So, at the time the user chooses to display content, I would not expect an onload() event to fire because the entire document is not being loaded. My problem is occurring after the entire document has been loaded and after a user clicks some button which causes innerHTML to be set.

Thanks!
Bear Bibeault
Author and ninkuma
Marshal

Joined: Jan 10, 2002
Posts: 60766
    
  65

Sounds like you've got some threading problems in your code. The user should not be able to boof things up by clicking stuff while an Ajax request is under way. Your code needs to handle these cases.

The sledge-hammer approach is to simple disable the page while a request is underway. The better approach is to identify what interactions can cause problems and prevent them from causing them.
Kelly Dolan
Ranch Hand

Joined: Jan 08, 2002
Posts: 109
The ajax request is done when the user clicks the "next" button and the problem occurs.
Bear Bibeault
Author and ninkuma
Marshal

Joined: Jan 10, 2002
Posts: 60766
    
  65

OK, so it sounds like some debugging is in order. Isolate what code is failing and why. What is the difference in state between when it works and when it doesn't? And so on.
 
I agree. Here's the link: http://aspose.com/file-tools
 
subject: how to tell when ie 7 is done rendering?
 
Similar Threads
binding and unbinding and rebinding events in jQuery
dojo grid EnhancedGrid
js references/garbage collection/other questions
history.back problem
Session Synchronization Problem in JSF