[Javascript] Disabled property for input

Harry Love hlove at u.washington.edu
Mon Aug 19 11:58:15 CDT 2002


Is this what you're talking about?  The following works in
d.getElementById() capable browsers.  Alternatively, you could use the
document.forms[] array.
In the version below, when a user changes the select box to "Done," the
"Completed Date" input is disabled.  If the user selects any other
option, the input box is enabled.  I also added a style change for an
added visual cue that the box is enabled or disabled. 


<script type="text/javascript" language="JavaScript">
var d = document;
function enableField()
{
	if(d.getElementById("status").value == "Done")
	{
		d.getElementById("completedDate").disabled = false;
		d.getElementById("completedDatePara").style.color =
"#000";
	}
	else
	{
		d.getElementById("completedDate").disabled = true;
		d.getElementById("completedDate").value = "";
		d.getElementById("completedDatePara").style.color =
"#999";
	}
}
</script>
</head>

<body>
<form>
<p>Status<br />
<select onchange="enableField()" name="status" id="status">
<option value="Standby">Standby</option>
<option value="In Progress">In Progress</option>
<option value="On Hold">On Hold</option>
<option value="Done">Done</option>
</select>
</p>

<p id="completedDatePara">Completed Date<br />
<input type="text" id="completedDate" name="completedDate" value="" />
</p>

</form>
</body>
</html>


Regards,
Harry




More information about the Javascript mailing list