Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations SkipVought on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Hide/unhide <div> contents in new window

Status
Not open for further replies.

Lisae123

Programmer
May 26, 2005
16
0
0
US
I am creating a review screen for a form. The code writes to a new window, and I want to unhide certain div sections based on a dropdown selection. I'm having trouble getting the code to work because the <div> tags are in the code being writen to the new window. Here's my (sample) code:

Code:
function fieldReview() {

var newWindow = window.open("", "", "HEIGHT=200,WIDTH=250,resizable=1");

d = document.NewUser;

dept = d.Department.value;

var rl = document.getElementById(dept).value;

document.getElementById(revEmp).style.display='none';

t = d.Type.value;

newWindow.document.write("<body bgcolor='#D6E1EB' text='#87a7c5'><font face='Arial, Helvetica, sans-serif'>First Name:<b> " + d.ufname.value + "</b><br>Last Name:<b> " + d.ulname.value + "</b><br>Department:<b> " + dept + "</b><br>Role:<b> " + rl + "</b><br>Type: <b>" + d.Type.value + "</b></font><div id='revEmp' style='display:none'>Testing...</div>");
}

Code:
<select name="Type" id="Type">
      <option value="Emp">Employee</option>
      <option value="Con">Contractor</option>
    </select>

I'm just trying to hide it to begin with, but I get a "'revEmp' is undefined" error. How do I tell it that the ID named 'revEmp' is in the new window?
 
newWindow.document.write("<body bgcolor='#D6E1EB' text='#87a7c5'><font face='Arial, Helvetica, sans-serif'>First Name:<b> " + d.ufname.value + "</b><br>Last Name:<b> " + d.ulname.value + "</b><br>Department:<b> " + dept + "</b><br>Role:<b> " + rl + "</b><br>Type: <b>" + d.Type.value + "</b></font><div id='revEmp' style='display:none'>Testing...</div>");
}

newWindow.document.getElementById(revEmp).style.display='none';

From your document.write, it is already display:none, why do you need to set it again?
 
I've been trying different things and forgot to take the style='display:none' out of the div tag. But that makes no difference as far as the error. I need to be able to hide/unhide depending on the value of a drop down that is in the form. I was just trying to tackle first things first - so far I can't get it to understand that the div with 'ID=revEmp' is in the code being written to the new window. Anyone know how to do that?
 
So, you did actually try my code above?
Hm. that's weird.
You gotta call the .write first, then you should call the getElementById.

If you write the code as the order above, will it work as you wanted?
 
No it won't. It writes the new window, with the contents of the div tag visible, and then throws the error.

 
Hi there.
Try this and do some modification in between. :)

I tested this and it works.

<html>
<head>
<script type="text/javascript">
function fieldReview() {
var newWindow = window.open("", "", "HEIGHT=200,WIDTH=250,resizable=1");
newWindow.document.write("<body bgcolor='#D6E1EB' text='#87a7c5'><div id='revEmp'>Testing...</div>");
newWindow.document.getElementById('revEmp').style.display='none';
}
</script>
</head>
<body onload="fieldReview()">
</body>
</html>
 
DAH! ...I didn't have the single quotes around 'revEmp' before ...now it works, thanks Woody!
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top