Textarea & Select

In addition to standard inputs fields, HTML provides more versatile form control like <textarea> for a multiline text and <select> for dropdown menus. These elements enhance user interaction and allow for richer data collection.

Textarea Element

Use the <textarea> tag when you want user to enter long or multiline input, such as comments or feedback.

				
					<textarea name="comment" rows="4" cols="50">
Enter your comment here...
</textarea>

rows control the height (number of lines).
cols control the width (numbers of characters).
Default text appears between the opening and closing <textarea> tags.

Select Element (Dropdown Menu)

The <select> element creates a dropdown list. Use it when users need to pick one value from a predefined list.

				
					<select name="fruits">
  <option value="apple">Apple</option>
  <option value="banana">Banana</option>
  <option value="cherry">Cherry</option>
</select>

Each <option> is an item in the list.
The value attribute is the data sent to the server when submitted.

Combine Textarea and Select in a Form

You can use both elements together to collect diverse types of inputs in one form.

				
					<form action="/submit">
  <textarea name="comment" rows="4" cols="50">Enter your comment here...</textarea>
  
  <select name="fruits">
    <option value="apple">Apple</option>
    <option value="banana">Banana</option>
    <option value="cherry">Cherry</option>
  </select>
  
  <input type="submit" value="Submit">
</form>

This example collects a comment and a selected fruit, then sends the data when the user clicks Submit.

Conclusion

The <textarea> and <select> tags help you create more dynamic and flexible forms. Using them effectively improves usability and enables better data inputs from users.