Survey form project - your name-label should be a descendant of the survey-form

Please how can I make my #name and #submit a descendant of my survey-form id? I am having a hard time figuring out what the problem with my code can be.

Your code so far

WARNING

The challenge seed code and/or your solution exceeded the maximum length we can port over from the challenge.

You will need to take an additional step here so the code you wrote presents in an easy to read format.

Please copy/paste all the editor code showing in the challenge from where you just linked.

Replace these two sentences with your copied code.
Please leave the ``` line above and the ``` line below,
because they allow your code to properly format in the post.

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/101.0.4951.67 Safari/537.36

Challenge: Build a Survey Form

Link to the challenge:

Did you give the id = “name” for name input field? This will fix your issue.

1 Like

Yes, I did and it’s still not working. The error message says I should make the #name, #email, #number, #name-label, #number-label, #email-label and #submit, a descendant of the #survey-form.

1 Like

Please give your code, it is difficult to find your problems without your code

1 Like

I suggest you to reset the challenge and try again. If you give the id as name it should work actually. Please add your code to better understand where it went wrong.

<html>

  <head>

    <title>Survey Form</title>

      <link rel="stylesheet" type="text/css" href="styles.css" />

      </head>

      <body>

      <header>

        <h1 id="title">Survey Form</h1>

        <p id="description"><em>Kindly give us your best opinion</em></p>

      </header>

<form id="survey-form" class="survey-form"></form>

  <fieldset>

    <label id="name-label">Name: <input id="name" type="text"name="name" placeholder="Enter your full name" required/></label>

    <label id="email-label">Email: <input id="email" type="email" name="email" placeholder="Enter your email address" required/></label>

    <label id="number-label">Number: <input id="number" type="number" name="number" min="11" max="14" placeholder="Enter your phone number" required/></label>

    </fieldset>

  <fieldset>What do you like most about our product?

    <select id="dropdown" name="dropdown">

      <option value="">(select one)</option>

      <option value="1">product packaging</option>

      <option value="2">fast cooking time</option>

    </select>

    </fieldset>

  <fieldset>Would you recommend our product to someone else?

    <label><input type="radio" name="referral" class="inline" value="referral"/>Yes</label>

  <label><input type="radio" name="referral" class="inline" value="referral"/>No</label></fieldset>

  <fieldset>What would you like us to improve on? (check all that apply)

  <label><input type="checkbox" value="suggest" name="price" class="inline">Price of product</label>

  <label><input type="checkbox" value="checboxes" name="delivery" class="inline">Delivery time</label>

  <label><input type="checkbox" value="checkboxes" name="packaging" class="inline">Product packaging</label>

  <label><input type="checkbox" value="checkboxes" name="customer service" class="inline">Customer service</label></fieldset>

  <fieldset>

       <label>Additional Comment: <textarea rows="3" cols="30" name="textarea"></textarea></label>

  <button id="submit" type="submit" value="Submit">Submit</button>

  </form>

  </body>

  </html>
1 Like

I’ve edited your post for readability. When you enter a code block into a forum post, please precede it with a separate line of three backticks and follow it with a separate line of three backticks to make it easier to read.

You can also use the “preformatted text” tool in the editor (</>) to add backticks around text.

See this post to find the backtick on your keyboard.
Note: Backticks (`) are not single quotes (’).

Tell us what’s happening:

The error message says I should make the #name, #email, #number, #name-label, #number-label, #email-label and #submit, a descendant of the #survey-form.

I have tried but my code is still not working. Please any tip will help.

Below is my code…

Your code so far

WARNING

The challenge seed code and/or your solution exceeded the maximum length we can port over from the challenge.

You will need to take an additional step here so the code you wrote presents in an easy to read format.

Please copy/paste all the editor code showing in the challenge from where you just linked.

<html>
  <head>
    <title>Survey Form</title>
      <link rel="stylesheet" type="text/css" href="styles.css" />
      </head>
      <body>
      <header>
        <h1 id="title">Survey Form</h1>
        <p id="description"><em>Kindly give us your best opinion</em></p>
      </header>
<form id="survey-form" class="survey-form"></form>
  <fieldset>
    <label id="name-label">Name: <input id="name" type="text"name="name" placeholder="Enter your full name" required/></label>
    <label id="email-label">Email: <input id="email" type="email" name="email" placeholder="Enter your email address" required/></label>
    <label id="number-label">Number: <input id="number" type="number" name="number" min="11" max="14" placeholder="Enter your phone number" required/></label>
    </fieldset>
  <fieldset>What do you like most about our product?
    <select id="dropdown" name="dropdown">
      <option value="">(select one)</option>
      <option value="1">product packaging</option>
      <option value="2">fast cooking time</option>
    </select>
    </fieldset>
  <fieldset>Would you recommend our product to someone else?
    <label><input type="radio" name="referral" class="inline" value="referral"/>Yes</label>
  <label><input type="radio" name="referral" class="inline" value="referral"/>No</label></fieldset>
  <fieldset>What would you like us to improve on? (check all that apply)
  <label><input type="checkbox" value="suggest" name="price" class="inline">Price of product</label>
  <label><input type="checkbox" value="checboxes" name="delivery" class="inline">Delivery time</label>
  <label><input type="checkbox" value="checkboxes" name="packaging" class="inline">Product packaging</label>
  <label><input type="checkbox" value="checkboxes" name="customer service" class="inline">Customer service</label></fieldset>
  <fieldset>
       <label>Additional Comment: <textarea rows="3" cols="30" name="textarea"></textarea></label>

  <button id="submit" type="submit" value="Submit">Submit</button>
  </form>
  </body>

  </html>

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/101.0.4951.67 Safari/537.36

Challenge: Build a Survey Form

Link to the challenge:

When you remove the name attribute, make sure there is a space between each attribute.

You will have to delete the extra </form>, only then will the labels be descendants of the form

2 Likes

Thank you, it has worked.

1 Like

If you go to the website in the example and click right you can select “view source” If you copy this code you can pass the step!

Put your form closing tag at the end and enjoy.

Unfortunately, we can’t see your code

1 Like

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