CancelImage Upload

How to dynamically enable and disable textareas and textboxes with JavaScript

In order to disable and enable textareas the disable/enable property needs to be set, unset within the form element. Here is how this goal can be achieved using JavaScript and the getElementById() function:

var textarea = document.getElementById('textarea');

textarea.disabled = true;

And while true activates a textarea, false will deactivate it:

var textarea = document.getElementById('textarea');

textarea.disabled = false;

To add to the disabled effect of course we can also change the background color of the textarea. Again this can be achieved via getElementById()

<html>
<head>
<title>How to enable/disable a textarea using JavaScript</title>
<script type = "text/javascript">

function disable()
{

       var textarea = document.getElementById('textarea');

       textarea.disabled = true;

       textarea.style.background = "#DDD";

}

function enable()
{

       var textarea = document.getElementById('textarea');

       textarea.disabled = false;

       textarea.style.background = "#fff";

}

</script>
</head>
<body>

<textarea id="textarea"></textarea>
<br><br>
<input type="button" value="Disable" onclick="javascript:disable();">
<input type="button" value="Enable" onclick="javascript:enable();">

</body>
</html>


Login
Want to leave a comment?

No problem. Just enter your email and password below.


register | home | reminder

myDesignTool Networking • www.mydesigntool.cominfo@mydesigntool.com