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 Choosing Options Create a Select Menu

Posted by Mel Warhol
Mel Warhol
Courses Plus Student 7,859 Points

Add a submit button with the text Place Order. I did that but it keeps telling me its wrong :/.

'''html <form action="index.html" method="post"> <h1>Shirt Order Form</h1> <label for="color">Shirt Color</label> <select id="color" name="shirt_color">

      <option value="red">red</option>
      <option value="yellow">yellow</option>
      <option value="purple">purple</option>
      <option value="blue">blue</option>
      <option value="green">green</option>
      <option value="orange">orange</option>
      <button type="submit">Place Order</button>


</form>

'''

8 Answers

Jason Anello
Jason Anello
Courses Plus Student 94,610 Points

Hi Mel,

Your html didn't post correctly so I can't make out all of it but it looks like you did not close your select element.

Ricky Catron
Ricky Catron
13,023 Points
Ricky Catron
Ricky Catron
13,023 Points

I think you need to put the options within a select tag and the button needs to be outside of the tag. Something along the lines of:

<form>
    <select>
        <option></option>
    </select>
    <button></button>
</form>
luis alvarado
PLUS
luis alvarado
Courses Plus Student 987 Points
luis alvarado
luis alvarado
Courses Plus Student 987 Points

this is how you do the code

<form action="index.html" method="post"> <h1>Shirt Order Form</h1>

  <label for="color">Shirt clor:</label>
  <select id="color" name="shirt_color">

    <option value="red">Red</option>
    <option value="yellow">Yellow</option>
    <option value="purple">Purple</option>
     <option value="blue">Blue</option>
    <option value="green">Green</option>
    <option value="orange">orange</option> 

  </select>
    <button type="submit">Place Order</button> 
</form>

hope a helps

Mel Warhol
PLUS
Mel Warhol
Courses Plus Student 7,859 Points
Mel Warhol
Mel Warhol
Courses Plus Student 7,859 Points

Jason, you're awesome. That was the problem lol.

Thank you Ricky for your help as well!

Ricky Catron
Ricky Catron
13,023 Points

Glad to help!

Jason Anello
Jason Anello
Courses Plus Student 94,610 Points

You're welcome.

Yosef Ali
Yosef Ali
15,182 Points
Yosef Ali
Yosef Ali
15,182 Points

Thanks!

Kenneth Swoger
Kenneth Swoger
10,985 Points
Kenneth Swoger
Kenneth Swoger
10,985 Points

Thanks! I had the same question.

jon finister
seal-mask
.a{fill-rule:evenodd;}techdegree
jon finister
Front End Web Development Techdegree Student 2,466 Points
jon finister
.a{fill-rule:evenodd;}techdegree
jon finister
Front End Web Development Techdegree Student 2,466 Points

Thank you for that. I made the same mistake of not adding the closing </select> bracket as well.

Madison Mills
Madison Mills
5,899 Points

Yeah usually they are good about pointing out when a closing bracket is needed but I don't remember him stating that this time around and it was easy to miss.

Rekkai Steed
Rekkai Steed
6,269 Points
Rekkai Steed
Rekkai Steed
6,269 Points 
<form action="index.html" method="post">
      <h1>Shirt Order Form</h1>
      <label for="color">Shirt Color:</label>
      <select id="color" name="shirt_color">
        <option value="red">Red</option>
        <option value="yellow">Yellow</option>
        <option value="purple">Purple</option>
        <option value="blue">Blue</option>
        <option value="green">Green</option>
        <option value="orange">Orange</option>
      </select>
        <label>Shirt Size:</label>
        <input type="radio" id="small" value="small" name="shirt_size">
        <input type="radio" id="medium" value="medium" name="shirt_size">
        <input type="radio" id="large" value="large" name="shirt_size">
        <button type="submit">Place Order</button>
    </form>