asked on

Collapsing and expanding iframes on click of a link!

Hi!
I am using a 'Master.jsp' that uses "iframes".
I also have a code, that expands or collapses the iframes when the + button is clicked!
The code run as:
<tr>
<td width="100%" id="block1" class="sectionOpen" onClick="ShowHide('block1','employeeInfoTab','<%=request.getContextPath()%>/jsp/resume/ShowEmployee.do','employeeInfoFrame')" >employee info</td>
</tr>
<tr style="display: '';" id="employeeInfoTab"><td width="100%">
<iframe src="<%=request.getContextPath()%>/jsp/resume/ShowEmployee.do" name="employeeInfoFrame" width="100%" height="520">
</iframe>
</td>
</tr>

The problem is that I have a EXPANDALL and COLLAPSEALL link in the header file!
If I click on this I want all the pages(iframes) to collapse or expand! How do I achieve this!

Pls guide!
JitenNikhil

ASKER CERTIFIED SOLUTION

daohailam

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

JitenNikhil

ASKER

Hi!
I am having this code inside the Header.jsp!
<a href="javascript:ShowAll()">Show all</a> <a href="javascript:CollapseAll()">Collapse all</a></br>

So even though I make the changes it does not work!

JitenNikhil

ASKER

My Master.jsp looks like:
<body>
<table id="info" width="100%">
<tr id="header">
<td width="100%">
<iframe height="100" src="header.jsp" width="100%"></iframe>
</td>
</tr>
<%if(request.isUserInRole("resume_admin")){%>
<tr id="control">
<td width="100%" id="block1" class="sectionOpen" onClick="ShowHide('block1','searchInfoTab')" >Search</td>
</tr>
<tr style="display: '';" id="searchInfoTab">
<td width="100%">
<iframe src="<%=request.getContextPath()%>/jsp/resume/ShowSearchPage.do" width="100%" height="520">
</iframe>
</td>
</tr>

and my header.jsp looks like:
<script>
function CollapseAll() {
var t = document.getElementById('info');
for (var i = 0; i < t.rows.length; i++) {
if (t.rows[i].id != "control") {
t.rows[i].style.display = 'none';
t.rows[i].style.visibility = 'hidden';
}
}
</script>
<td width="50%" class="logo"><div align="center"><a href="#">EXPAND ALL</a> | <a href="CollapseAll()">COLLAPSE ALL</a> </div>

daohailam

Missing a '}' at the end of CollapseAll() => script error (?!)

JitenNikhil

ASKER

thanks Daohailam!