Links

Lists

Latest Updates

Ruby On Rails List
Python list
Advanced Java
The JavaScript List
Apache Users
Full Disclosure
Linux Security

Search the archives!
Having a development problem? Ask eDevelopment.org forums!

[Date Prev][Date Next][Thread Prev][Thread Next][Date Index][Thread Index]

[Javascript] Disabled property for input

  • From: javascript@xxxxxxxxxx (Harry Love)
  • Subject: [Javascript] Disabled property for input
  • Date: Mon, 19 Aug 2002 09:58:15 -0700
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