HTML Textarea Code
This page contains HTML textarea code — code for creating a textarea on an HTML document.
A textarea is a form element that allows the user to enter multiple lines of text. A textarea is created with the HTML
<textarea> tag. The textarea can be nested inside a
<form> element or it can stand alone. It can also be associated with a form via its
Basic Textarea Example
Here's an example of an HTML textarea:
The above textarea consists of a start and an end tag. Enclosed between these tags is the contents of the textarea. In this case it's the text "Enter text here...". The tag also contains some attributes (in this case,
maxlength). These are just some of the many attributes that can be applied to this element. For a full list of attributes, see
Add a Submit Button
So you've got a textarea. Users can now enter text into it. But that text won't go anywhere or do anything unless you add some more code.
Let's add a "submit" button. We will also put the textearea inside a form. Now, the user can click the "submit" button to send the text to the server.
In this case, the textarea is enclosed inside a
<form> element, which specifies a page on the server that will process the contents of the textarea. This example also uses an
<iframe> to display the processing page.
You can specify placeholder text to provide a hint to the user to help them complete the textarea. For example, this could be sample text or a description of the expected format.
To add placeholder text, use the
For best results, leave the textarea blank. Otherwise the textarea's contents will probably be displayed instead of the placeholder text. Here's an example:
Minimum & Maximum Length
You can specify a minimum and/or a maximum length for the text inside the textarea. These attributes limit how many characters the user can enter into the textarea field.
In the above example, we enclosed the textarea inside of a form. HTML5 also allows you to specify a form using the
form attribute. This method could be used in the event that the textarea is not inside the form that needs to submit its contents.
In the next example, add
id="myForm" to the form. We then add
form="myForm" to the textarea and move the textarea outside of the form. Submitting the form should still submit the contents of the textarea, because it references the
id of the form in its
Disabling a Textarea
You can disable a textarea by using the
disabled attribute. You could use this in conjunction with a script to enable/disable the textarea depending on whether certain criteria has been met.
Also check out textboxes for more about working with the textarea element.