Page 1 of 1

Show/Hide Div Problem

Posted: Sun Apr 04, 2010 11:32 pm
by jthermane24
So I'm working on a form where you can create/edit a site option in one form (easier to script for me lol) and I want the textbox for the option_name value to appear when you select "new option" from the dropdown above it, and hide if you select another choice. There is currently a toggle script which will be changed out for a show/hide div script (it'll work better for the page), but I can't get the toggle script to work. The internet hasn't helped, so can someone look over this for me and see if they can tell me what's wrong. Thanks.

Code: Select all

<!DOCTYPE html PUBLIC "-/W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
<title><?php siteoption('sitename'); ?></title>

<script type="text/javascript"> 

 function toggle_visibility(whichLayer) {
 var elem, vis;
 if(document.getElementById) // this is the way the standards work
   elem = document.getElementById(whichLayer);
 else if(document.all) // this is the way old msie versions work
     elem = document.all[whichLayer];
 else if(document.layers) // this is the way nn4 works
   elem = document.layers[whichLayer];
 vis = elem.style;
 // if the style.display value is blank we try to figure it out here
 if(vis.display==''&&elem.offsetWidth!=undefined&&elem.offsetHeight!=undefined)
   vis.display = (elem.offsetWidth!=0&&elem.offsetHeight!=0)?'block':'none';
 vis.display = (vis.display==''||vis.display=='block')?'none':'block';
}
</script>
</head>
<body>

<p style="margin-left:auto; margin-right:auto; text-align:center">
<legend>Edit/Create Options</legend>
<form name="first" action="<?php echo'PHP_SELF' ?>" method="post">
  <h3 id="nobottom">Option ID:</h3>
    <select name="value_id">
    	<option selected="selected">...</option>
      <option value="new" onclick="toggle_visibility('option_name');">New Option</option>
      <option value="2" onclick"toggle_visibility('option_name');">2</option> <!-- These options will be generated via php -->
    </select>
    <br />
    <div id="option_name" style="display: none;" ><h3 id="nobottom">Option Name:</h3>&nbsp;<input type="text" name="option_name"  /></div>
    <h3 id="nobottom">Option Value:</h3><br />
    <textarea name="option_value" id="MCEEditor" rows="10" style="width:100%"></textarea>
    <br />
    <input type="submit" name="submit" style="margin:0;padding:2px 5px;color:#666666" />
    <input type="reset" style="margin:0;padding:2px 5px;color:#666666" />
</form>
</fieldset>
  </p>
  
  
</body>
</html>