Forum Moderators: open
The idea is that an ID represents a unique item, so what if I have multiple items that are supposed to be represented by one item?
For example, let’s suppose I’m creating a CMS and on my “Create new article” page, I have this button called, “Advanced.”
And by clicking the “Advanced” button, it will use javascript to show all items that are in <div id="Advanced"> (basically a simple show/hide javascript)
Also, I can’t group all the “Advanced” stuff together because they are going to be in different fieldsets.
So in this case, would it be ok to have only multiple IDs on this page? Or does that just not work?
<html>
<head>
<title>Toggle Advanced</title>
<style type="text/css">
<!--
.advanced { display: none; }
-->
</style>
<script type="text/javascript">
<!--
var advancedVisible = false;
function toggleAdvanced(){
var the_divs = document.getElementById('the_form').getElementsByTagName("DIV");
var new_state = '';
if(advancedVisible){
new_state = 'none';
advancedVisible = false;
} else {
new_state = 'block';
advancedVisible = true;
}
for(var i in the_divs){
var cur = the_divs[i];
if(cur && cur.className=='advanced'){
cur.style.display = new_state;
}
}
}
//-->
</script>
</head>
<body>
<p><a href="#" onclick="toggleAdvanced();return false;">Toggle Advanced Options</a></p>
<form action="" method="post" id="the_form">
<input type="text" name="simple1" value="" />
<div class="advanced"><input type="text" name="advanced1" value="" /></div>
<input type="text" name="simple2" value="" />
<div class="advanced"><input type="text" name="advanced1" value="" /></div>
</form>
</body>
</html>