I have a series of five flowcharts in a tabbed layout, one flowchart per tab (seem to be doing tabs a lot lately). I wanted the user to be able to click a link on another page, and have the flowchart page open to the correct flowchart layer. A working example is here:
Switch layers on the next page by clicking a link
When I tried setting the value of a variable on the new page, it worked in some browsers but not others, probably because some computers are slower at loading pages than others, and the necessary layers would not be loaded in time for the variable to have something to populate.
Ads by Google
Posted by ellen at January 03, 2005 04:14 PM I had a couple of functions in the first page something like:
<script language="JavaScript" type="text/JavaScript">
<!--
function openwindow()
{
flowchart = window.open('http://www.med.umich.edu/i/mandatories/restraint/flowchart/index.htm','flowchart');
setTimeout('switchLayers',5000);
}
function switchLayers(selectedLayer)
{
flowchart.document.getElementById('Agitation').style.visibility = 'hidden';
flowchart.document.getElementById(selectedLayer).style.visibility = 'visible';
// return false;
}
-->
</script>
This worked on fast machines, but not on slow ones, and not at all on Netscape.
So instead I decided to put the parsing code in the receiving page, the flowchart page.
Here's how I got this to work:
The links on the first page are of this form:
<a href="http://yourserver.com/flowchart.htm?agit" target="new">Click to go to AgitationThis sends a 4 letter code to the target page in the URL. I included a script at the head of the receiving page:
<a href="http://yourserver.com/flowchart.htm?poor" target="new">Click to go to Poor Sitting Posture
<a href="http://yourserver.com/flowchart.htm?wand" target="new">Click to go to Wandering
Click to go to Unsafe Mobility
<a href=http://yourserver.com/flowchart.htm?conf" target="new">Click to go to Confused Behavior
<script language="JavaScript" type="text/JavaScript">
<!--
function switchLayers(selectedLayer, deselectedLayer)
{
document.getElementById(selectedLayer).style.visibility = 'visible';
document.getElementById(deselectedLayer).style.visibility = 'hidden';
return false;
}
function jumpToLayer()
{
query = window.location.search.substring(1,5);
document.getElementById('Agitation').style.visibility = 'hidden';
if (query=='agit') {
document.getElementById('Agitation').style.visibility = 'visible';
}
else if (query=='conf') {
document.getElementById('ConfusedBehavior').style.visibility = 'visible';
}
else if (query=='wand') {
document.getElementById('Wandering').style.visibility = 'visible';
}
else if (query=='poor') {
document.getElementById('PoorSittingPosture').style.visibility = 'visible';
}
else if (query=='unsa') {
document.getElementById('UnsafeMobility').style.visibility = 'visible';
}
else {
document.getElementById('Agitation').style.visibility = 'visible';
}
}
-->
</script>
Then I included this script at the very end of the page "flowchart.htm" just before the body tag. I put it at the end to make sure the layers had all been parsed and loaded by the browser.
<script language="JavaScript" type="text/JavaScript"> <!-- jumpToLayer(); --> </script>
this is wonderful... thanks…
Great post, as usual.
God help me, I put aside a whole afternoon to fgirue this out.
The ideal site. That's what I was looking for. Regards % NAME%