[RESOLVED] Referencing identical id's in nested iFrames
Here's my problem:
I have groups of elements that are scattered around my page but have identical id's so that I can reference them all at once (as a group).
These elements are sitting inside of an iFrame, that is sitting inside another iFrame (that is building a nested navigation bar).
So what I want to do is have a script sitting in the top document that when a button is pressed it will reference those double-nested identical id's and toggle their display.
and this is what I have so far...
(while testing, I do not have any identical id's)
Now, as you can see, I have alert boxes tracing debug information for me. So when I hit the check boxes, both the 1st and 2nd alert box trigger, but the 3rd does not, so I know the error is hitting at myDIV's definition.
<!-- my buttons -->
<input type="checkbox" name="DTS" onclick="toggleFilter(\'DTS\', this.checked);" checked /> Toggle DTS Numbers |
<input type="checkbox" name="DCS" onclick="toggleFilter(\'DCS\', this.checked);" checked /> Toggle DCS Numbers |
<input type="checkbox" name="IGT" onclick="toggleFilter(\'IGT\', this.checked);" checked /> Toggle IGT Numbers
<!-- my script -->
function toggleFilter(myElement, myChecked)
alert("toggleFilter("+ myElement +","+ myChecked +")");
var toggle =(myChecked == true)? "block" : "none";
alert("toggle = "+ toggle);
var myDIV = document.frames["parentFrame"].document.frames["bodyFrame"].document.getElementById("272");
alert("myDIV = "+ myDIV);
myDIV.style.display = toggle;
alert(myDIV +".style.display = "+ toggle);
I looked at a bunch of sites and this was the best I could devise for how to do it, but it's obviously not working.