Hi,
Let me explain the scenario. I have a main html (e.g. main.html) page, which includes
a link to inner.html page. Clicking this link will load the inner page, containing a tree
structure.
http://www.jayakumar.net/sample/main.html
The loading method is such that only the body content from inner page is loaded to the main
page, without refreshing the main page.I believe this method is called partial rendering of pages.
The method used to load is:
A hidden iframe and a div (the hidden iframe is used to fetch other html content and to
write it to the div).
<div id=‘bodyContent’ style=“display:none;”></div> (This is the div into which the content
is written)
<iframe id=‘process’ name=‘process’ style=‘visibility: hidden; height:0px’
onload=‘javascript:loadResults();’></iframe> (This iframe reads data and writes to the
div)
The onload event of iframe calls the following function
<script type=“text/javascript”>
function loadResults() {
var processElm = document.getElementById('process');
var bodyContentElm = document.getElementById('bodyContent');
//eval of script content;
bodyContentElm.innerHTML = processElm.contentWindow.document.body.innerHTML;
bodyContentElm.style.display = "block";
}
</script>
I added the tree structure to the inner.html page. In this case I had to include both the
css and js files for tree stucture, in the <head> section of parent page (i.e main.html).
But when I run the main.html page, the tree structure is not working. Only the text is
displayed. In firefox, refreshing the page will load the tree. But not in other browsers.Even if the tree is displayed correctly first time, clicking the link again will not load the tree.
Please note that due to some technical reasons, I cannot change the iframe method. And also
I am a designer and have a very little programming knowledge. Can any body help me.Not only this tree, but other UI controls like Adobe spry, other third party scripts etc fail to render correctly in such a situation.
Regards,
JK