My Survey Form - help/feedback

Hey!

I made my second project and it is kind of simple but it meets the requirements. I only have one problem and it is the ‘age’ input is not passing the tests even though the functionality works - it doens’t allow non-number inputs and it requires an input and it only accepts numbers. If anyone could help me figure out why this is happening I’d really appreciate your it.

here is the link:

Thanks,
astro_dev

Your form looks good @astro_dev.

This is an easy fix. When tests fail, click the red button to see which test(s) are failing and text to help you correct the issue. In this case the test says,

If I enter non-numbers in the number input, I will see an HTML5 validation error.
Number field should be HTML5 validated : expected undefined to equal 'number' 
AssertionError: Number field should be HTML5 validated : expected undefined to equal 'number' 

Your input field has an id set to “age”
The following test is also failing;

## For the name, email, and number input fields inside the form I can see corresponding labels that describe the purpose of each field with the following ids: id="name-label", id="email-label", and id="number-label".  
#number-label is not defined : expected null to not equal null

The following lines need to be changed;

<label for="age" id="number">Age</label>
  <input type="number" id="age" placeholder="Enter your age" min="12" max="120"  required>

Change them to;

<label for="number" id="number-label">Age</label>
  <input type="number" id="number" placeholder="Enter your age" min="12" max="120"  required>

Some other things to revisit;

  • Codepen provides the boilerplate for you. It only expects the code you’d put within the body element in HTML. (No need to include the body tags). For anything you want to add to the <head> element click on the ‘Settings’ button, then HTML and add it into the ‘Stuff for <head>’ box.
    • The link to the font goes in the box labeled ‘Stuff for <head>’
  • Run your HTML code through the W3C validator.
    • Since copy/paste from codepen you can ignore the first warning and first two errors.
    • There are HTML coding errors you should address.
  • Users should be able to click on the label to select, not just the radio button / checkbox.
    • The checkboxes work okay, the radio button labels cannot be selected.
  • Change the cursor to a pointer when hovering over the submit button

Thank you so much I wasn’t able to figure this out for a while. Second I changed it all 17/17 user stories passed so now I’m done with challenge 2. Onto project 3 now, I have a pretty good idea I’m going to make a “AstroPong” website and it’ll showcase a pong game I made in javascript/html canvas so it’ll be my product webpage.

Good that I could help.
Don’t forget to run your code through the validator and correct the HTML errors.

Oh I forgot that wow there are a lot of errors i’m surprised the HTML even works

Hey,

I took a peek at your project and I would only add that the font, specifically in checkboxes, is a bit hard to read for me. Maybe you can increase the font-size a little or add some spacing?