"Build a Simple Android App" was retired on September 15, 2017. You are now viewing the recommended replacement.

Heads up! To view this whole video, sign in with your Courses account or enroll in your free 7-day trial. Sign In Enroll

HTML Forms

Well done!

You have completed HTML Forms!

Sign up for Treehouse Back to Library

The Textarea Element

2:08 with Nick Pettit

Sometimes a single line of text isn’t enough and a simple input element won’t work. For example, maybe you have a contact form and you need a place for people to type a message. In those cases, it’s best to use a textarea.

The <textarea> element

  • The textarea-element accepts multiple lines of text from the user. Most browsers will render the textarea element with a widget to allow for resizing the editing area.

Resources

Related Discussions

Have questions about this video? Start a discussion with the community and Treehouse staff.

Sign up

    Related Discussions

    Have questions about this video? Start a discussion with the community and Treehouse staff.

    Sign up

    Sometimes a single line of text isn't 0:00
    enough and a simple input element won't work. 0:02
    For example, maybe you have a contact form and 0:06
    you need a place for people to type a message. 0:09
    In those cases, it's best to use the textarea element. 0:12
    In our sign-up form, we want to add a text area 0:16
    so that users can type in a short bio about themselves. 0:20
    I'm going to type in a textarea and then explain it. 0:24
    Just below our input elements, I'll type in textarea, 0:27
    and close it, and then I'll give it some attributes. 0:33
    I'll say id equals bio, and name 0:38
    equals user_bio, and I'll save that out. 0:43
    And, if we switch back to the browser and refresh, you can 0:50
    see that the text area allows us to type in multiple lines. 0:55
    So I'll say this is just a test bio, and I'll copy and paste that a few times. 1:01
    And when I do that, it will scroll to multiple lines. 1:11
    I can also resize the text area if I'd like to do so. 1:16
    So, let's switch back to our work space, and let's take a look at this element. 1:21
    As you can see, the textarea element is different from the 1:26
    input element, in that it is not a self closing tag. 1:30
    You need to type an opening and a closing tag for it to work. 1:34
    In most browsers, a text area is resizable by the user, like I showed you previously. 1:40
    There are ways to prevent this if you like 1:46
    but, personally, I prefer to leave this default behavior unmodified. 1:49
    That way, if the user would like more space to 1:55
    type in any direction, they can adjust it however they want. 1:58
    Well, that's it. 2:02
    Pretty easy, right? 2:03
    Next, we'll learn how to add a submit button to our form. 2:05

    You need to sign up for Treehouse in order to download course files.

    Sign up

      You need to sign up for Treehouse in order to set up Workspace

      Sign up