Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

HTML HTML Forms Form Basics Create a Submit Button

Steve Isaacs
Steve Isaacs
2,112 Points
Posted by Steve Isaacs
Steve Isaacs
2,112 Points

Not passing this forms code challenge question - why?

Says that my button needs to be in the form element, but it is!

html

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>HTML Forms</title>
  </head>
  <body>
    <form action="index.html" method="post">
      <input type="text" id="name" name="user_name">
      <textarea id="comment" name="user_comment">
      <button type="submit">Submit Comment</button>    
    </form>
  </body>
</html>

4 Answers

nvcxnvkldsjaklfds
nvcxnvkldsjaklfds
Courses Plus Student 5,041 Points

Steve Isaacs You have that issue because you did not close <textarea> element.

<button> element should be a descendant to <form> tag. If you do not close <textarea> element <button> element will be child to <textarea> element. Meaning <button> element loses its relationship "descendant" to <form> tag.

Please check the code snippet to understand what I mean? 

<form action="index.html" method="post">
      <input type="text" id="name" name="user_name">
      <textarea id="comment" name="user_comment"></textarea>
      <button>Submit Comment</button>
</form>

I hope I answer your question.

Jason Anello
Jason Anello
Courses Plus Student 94,610 Points

James,

The textarea element requires both a start and end tag. It's invalid html otherwise. If you don't include it then the browser will try to fix it for you by adding one and it messes up pretty badly in this particular case. Firefox and chrome both include the button in the textarea as well as an additional closing form, body, and html tags.

This is the html you end up getting when you leave off the closing </textarea>

<html>
<head>
  <meta charset="utf-8">
</head>
<body>
  <form method="post" action="index.html">
    <input id="name" type="text" name="user_name">
    <textarea id="comment" name="user_comment">
      <button type="submit">Submit Comment</button>
      </form>
      </body>
      </html>
    </textarea>
  </form>
</body>
</html>
Steve Isaacs
Steve Isaacs
2,112 Points
Steve Isaacs
Steve Isaacs
2,112 Points

The challenge said to add a submit button with no attributes, which I also tried, but still can't pass.

James Gill
PLUS
James Gill
Courses Plus Student 34,936 Points
James Gill
James Gill
Courses Plus Student 34,936 Points

Steve, not sure what's going on. I tried your code above in step 1 of the challenge--twice--and it passed both times. There must be something going on at your end.