Help with Certification survey form with some user stores

Hello FreeCodecamp community

I need help with some test i am not passing for the survey to be complete

<!DOCTYPE html>
<html lang="en">

<head>
  <link rel="stylesheet" href="style.css">
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Survey Form</title>
</head>
  
<body>
  <h1 id="title">Interested in buying a house</h1>
  <p id="description">Dear buyer we are making a survery about homeowners and their interest in order to understand how you feel in youw own homw</p>
  
  <form id="survey-form">
    <div class="form-control">
      <label for="name" id="name-label">Name:
        <input type="text" id="name-label" name="name" placeholder="Enter your name" required>
      </label>
    </div>
    <div class="form-control">
      <label for="email" id="email" placeholder="Enter your email" required>Email
        <input type="text" id="email-label" name="email" required placeholder="Enter your Email">
      </label>
    </div>
    <div class="form-control">
      <label for=" phone number" id="Phone-label" required>Telephone Number</label>
      <input type="tel" id="number-label" name="number" required placeholder="Enter  Tel Number">
    </div>
    <div class="form-control">
      <label for="age" id="number label" required>Age</label>
      <input type="number" id="number" min="18" max="70" placeholder="Age">

    </div>
    <div class="form-control">
      <label for="date" id="date-label" required>Year of Birth</label>
      <input type="date" id="date" required>
    </div>
    <p>Choose your home category</p>
    <div class="form-control">
      <select id="dropdown">
        <option disabled="" selected="" value="Select an option"></option>
        <option value="Townhouse">Townhouse</option>
        <option value="condominium">condominium</option>
        <option value="Single family">Single Family</option>
        <option value="Multi-family">Multi-family</option>
      </select>
    </div>
    <p>Would you recommend your house type to any friends</p>
    <div class="form-control">
      <label for="radio">Of Course</label>
      <input type="radio" id="radio" value="Of Course" name="recommend">
    </div>
    <div class="form-control">
      <label for="radio">Probably</label>
      <input type="radio" id="radio" value="Probably" name="recommend">
    </div>
    <div class="form-control">
      <label for="radio">Not sure</label>
      <input type="radio" id="radio" value="Not sure" name="recommend">
    </div>
    <p>Which part of the house would you like to remodel(check all that apply)</p>
    <div class="form-control">
      <label for="checkbox">Dinning Room</label>
      <input type="checkbox" id="checkbox" value="dinning room">
    </div>
    <div class="form-control">
      <label for="checkbox">Garage</label>
      <input type="checkbox" id="checkbox" value="garage">
    </div>
    <div class="form-control">
      <label for="checkbox">Roof</label>
      <input type="checkbox" id="checkbox" value="roof">
    </div>
    <div class="form-control">
      <label for="checkbox">Kitchen</label>
      <input type="checkbox" id="checkbox" value="kitchen">
    </div>
    <div class="form-control">
      <label for="checkbox">Bathroom</label>
      <input type="checkbox" id="checkbox" value="bathroom">
    </div>
    <div class="form-control">
      <label for="checkbox">Windows</label>
      <input type="checkbox" id="checkbox" value="windows">
    </div>
    <p>Any Comments or feedback?</p>
    <div class="form-control">
      <textarea placeholder="Enter your comment here"></textarea>
    </div>
    <button class="submit-button" id="submit">Submit</button>
  </form>
</body>
<footer>The testing company</footer>
<script src="https://cdn.freecodecamp.org/testable-projects-fcc/v1/bundle.js"></script>

</html>

Im having problems with the following:

5. Inside the form element, I am required to enter an email in a field with id=“email”. If I do not enter an email I will see an HTML5 validation error.

6. If I enter an email that is not formatted correctly, I will see an HTML5 validation error.

10. 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”.

11. For the name, email, and number input fields, I can see placeholder text that gives me a description or instructions for each field.’

From the documentation I have read is there but its not passing the test any ideas on why its wrong ?

If you have a Codepen for this, you can share the link here. It will make it easier for others to help you.

yes here is the codepen link

Let’s start with the first error.

"4. Inside the form element, I am required to enter my name in a field with id=“name”. If I do not enter a name I will see an HTML5 validation error.

There should be an input text field with id=‘name’"

Is there something you don’t understand about this message? Do you have an input text field with id="name"?

from what i understood in the input i should have a id with the reference of id=“name”?

Correct. So do you have an input with id="name"?

Yes i had it as id=“name-label” and change it to id=“name”

Perfect. I see that change in your codepen now and that test is passing now.

So all you have to do is go through all of the other tests one at a time and fix those issues as well. If you get stuck on a particular test then you can ask about that.

Good luck!

1 Like

thanks!

bbsmooth, for the validation error thats the one im having issues with, im reading the MDN reference but i think im missing something

Look at the error message the test is giving you closely:

"6. If I enter an email that is not formatted correctly, I will see an HTML5 validation error.

Email field should be HTML5 validated : expected ‘text’ to equal ‘email’"

Now look at your email input:

<input type="text" id="email"  required placeholder="Enter your Email"required>

Do you see anything in your input that could be related to the error message? Especially the bold part of the error message.

2 Likes

my assestment would be input type=“text=email”?

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.