PDA

View Full Version : Deactivate textarea and buttons in forms

CalypsoClub
03-17-2003, 06:26 PM
Hi folks,

is it possible to deactivate textareas and buttons in HTML forms with css or anyway else?

Thanks!
Nightfire
03-17-2003, 06:31 PM
add disabled or disable into them (can't remember if it's disabled or disable)

<input type="button" disabled>

Might work with textarea, not sure though

<textarea disabled></textarea>
Roy Sinclair
03-17-2003, 06:33 PM
With HTML you can deactivate them using properties like this:

<input type=... disabled="disabled" />

Of course to dynamically activate/deactivate them you need to use javascript:


<html>
<head>
<script>
function disableField(myField)
{
myField.mydisabled = true
myField.style.color = "red"
return true
}
function enableField(myField)
{
myField.mydisabled = false
myField.style.color = "black"
return true
}
function onfocusField(myField)
{
if (myField.mydisabled)
{
myField.blur()
return false
}
return true;
}

function toggleFields(myField)
{
if (myField.checked)
{
disableField(document.forms["example1"].text1)
disableField(document.forms["example1"].checkbox1)
disableField(document.forms["example1"].select1)
}
else
{
enableField(document.forms["example1"].text1)
enableField(document.forms["example1"].checkbox1)
enableField(document.forms["example1"].select1)
}
document.forms["example1"].text1
}
</script>
</head>
<body>
<form name="example1">
Disable Fields: <input type="checkbox" name="control1" onclick="toggleFields(this)" checked="checked">
<br>
Text Field: <input type="text" name="text1" onfocus="return onfocusField(this)">
<br>
Check box: <input type="checkbox" name="checkbox1" onfocus="return onfocusField(this)" onclick="return onfocusField(this)">
<br>
Select: <select name="select1" onfocus="return onfocusField(this)">
<option>Option 1</option>
<option>Option 2</option>
</select>
</form>
<script>
disableField(document.forms["example1"].text1)
disableField(document.forms["example1"].checkbox1)
disableField(document.forms["example1"].select1)
</script>
</body>
</html>
CalypsoClub
03-17-2003, 06:37 PM
Thanks!

Works like a charm!
J.C.
03-17-2003, 08:37 PM
Quick fix:

.forms {

display: none;

}


Then put:

<span class="forms"><form...

</form>
</span>

:)

Of course this doesn't actually disable the form it merely hides it.
oracleguy
03-18-2003, 02:24 AM
Originally posted by Nightfire
add disabled or disable into them (can't remember if it's disabled or disable)

<input type="button" disabled>

Might work with textarea, not sure though

<textarea disabled></textarea>

However, if you are following XHTML standards it would be:

<input type="button" disabled="1" />

Because all the attribs have to have a value even if they don't need one.

Just thought I'd point that out.