The HTML Form - Textarea Tag

The HTML Form - Textarea Tag
The HTML textarea tag is used to create a multi-lined text input field within a webpage form. If you only want to collect one line of user input, you would use the text input tag. However as the name implies the textarea tag is used to collect user input that is more than one line. Below is an example of a textarea tag input field.



Below is the basic code for the textarea tag.

<textarea name="comments" rows="3" cols="30">Your
comments here</textarea>
<left angle bracket
textarea element name
name attribute used to identify this input
rows attribute used to determine the number of lines of text that will be displayed
cols attribute used to determine the number of characters per line of text
> right angle bracket
</textarea> closing tag
Note--The arrow indicates that the code is wrapped to a second line and should really be all on one line.

You will notice from the example above that this tag is different from the other tags that we have discussed so far. Unlike the other tags, the textarea tag has both an opening <textarea> and closing </textarea> tag. Any text placed between the opening and closing textarea tags will appear in the textarea input field when the form initially displays on the webpage. The value of the rows and cols attributes will determine the size of the textarea input field on the webpage.

The Name Attribute
The value of the name attribute is a unique identifier for this textarea tag. Each textarea tag creates one multi-lined input field and each must have a unique identifier. This is how the processing program will determine which data came from which textarea input field. When you are setting the value for the name attribute, try to use an ID that will remind you of the purpose of the input field. In the example I have set the value of the name attribute to comments.

The Rows Attribute
The value of the rows attribute determines the number of lines that will be displayed in the textarea input field. If the user's input exceeds this number the scrollbar will automatically be activated. In the example I have set the value of the rows attribute to 3.

The Cols Attribute
The value of the cols attribute sets the number of characters per line of text that will be displayed in the input field. When the number of characters entered into the field exceeds this value, the remaining input will be displayed on the following line(s). In the example I have set the value of the cols attribute to 30.

|




This site needs an editor - click to learn more!



RSS
Editor's Picks Articles
Top Ten Articles
Previous Features
Site Map





Content copyright © 2023 by Diane Cipollo. All rights reserved.
This content was written by Diane Cipollo. If you wish to use this content in any manner, you need written permission. Contact BellaOnline Administration for details.