[Javascript] Hide or enable a form element

[Peter Brunone]

Here's one basic approach:

	You could have an onChange event handler in the <select> that triggers a
function to hide/show the other element, like

<select onChange="showHide(this);">

and then the script would go something like

function showHide(theSelect) {
	if(theSelect.options[theSelect.selectedIndex].value == 1) {
		otherSelect.visibility = 'hidden';
		}
	// and so on
	}

	The code you use to show/hide the select boxes will depend on the target
browser type.  For Internet Explorer, you'll use
document.all.selectID.style.visibility = 'hidden' or 'visible', for Netscape
4 you'll use document.selectID.visibility = 'hide' or 'show', and for
Netscape 6 and above you'll use
document.getElementByID("selectID").style.visibility = 'hidden' or 'visible'
(this also works for IE 5 and above).

Cheers,

Peter

|-----Original Message-----
|From: javascript-bounces at LaTech.edu
|[mailto:javascript-bounces at LaTech.edu]On Behalf Of Imants Cekusins
|
|Is there a simple way to show/hide or enable/disable a <select>
|form element
|by using another <select> element?
|
|let's say there's a drop down list box F with 1) "weekly" and 2) "monthly"
|options.
|
|depending on which option is picked in box F, web page visitors would be
|able to choose either from "week 1", "week 2", etc list (box W) or "Jan",
|"Feb" etc list (box M).  The irrelevant box would then either become hidden
|or disabled ("blurred").
|
|A solution using drop down lists (<select>) rather than radio or
|check boxes
|would be appreciated.