Survey Form - Build a Survey Form

Tell us what’s happening:

When I click run the tests, it’s saying that none of the conditions have been met. I know I’ve met at least some of them. Is this a glitch and if so, how do I fix it? Or am I just missing something?

Your code so far

<!-- file: index.html -->
<!DOCTYPE html>
  <html lang="en">
  <meta charset="UTF-8"> 
  <head> 
  <h1 id="title">Autistic Adult Survey</h1>
    <p id="description">Tell us about your experience as an Autistic adult. Self-diagnosis is valid.</p>  
  <link rel="stylesheet" href="styles.css"/>
  </head>
  <body>
  <form id="survey-form">
    <fieldset>
      <label for="name">Name:</label><input id="name-label" name="name" type="text" placeholder="First and Last Name" required ></input>
      <label for="email">E-mail:</label><input id="email-label" name="email" type="email" placeholder="Valid e-mail address" required </input>
      <label for="age">Age:</label><input id="number-label" name="age" type="number" min="13" max="120"placeholder="How old are you? (in years)"></input>
      <label for="status">Status:</label><select id="dropdown" name="status">
        <option value="">(select one)</option>
        <option value="1">Officially Diagnosed in Childhood</option>
        <option value="2">Officially Diagnosed in Adulthood</option>
        <option value="3">Self-Diagnosed</option>
        <option value="4">Suspected</option>
    </fieldset>
    <fieldset> 
      <label for="male"><input id="male" type="radio" name="sex" class="inline">Male</input></label>
      <label for="female"><input id="female" type="radio" name="sex" class="inline">Female</input></label> 
    </fieldset> 
    <fieldset>
      <legend>How much does autism impact your daily life?</legend>
      <label for="0"><input id="0" type="checkbox" value="impact" class="inline">0 (Not At All)</input></label>
      <label for="1"><input id="1" type="checkbox" value="impact" class="inline">1 (Somewhat)</input></label>
      <label for="2"><input id="2" type="checkbox" value="impact" class="inline">2 (Moderately)</input></label>
      <label for="3"><input id="3" type="checkbox" value="impact" class="inline">3 (Significantly)
    </fieldset>
    <fieldset>
      <label for="autismstory">What does being autistic mean to you? <textarea id="autismstory" name="austimstory" rows="3" cols="30" placeholder="Your story here..."</label></textarea>
   </fieldset>    
   <input type="submit" value="submit"/>
  </form>
  </body>
    </html>  
/* file: styles.css */
body {
  width: 100%;
  height: 100vh;
  margin: 0;
  background-color: #800000;
  color: #e6b800;
  font-family: Trebuchet MS;
  font-size: 16 px; 
}

h1, p {
  margin: 1em auto;
  text-align: center;
}

form {
  width: 60 vw;
  max-width: 500 px;
  min-width: 300 px;
  margin: 0 auto;
  padding-bottom: 2em;
}

fieldset {
  border: 2px solid #e6b800;
  padding: 2rem0;
}

label {
  display: block; 
  margin: 0.5rem 0;
}

input, textarea, select {
  margin: 10px 0 0 0;
  width: 100%;
  min-height: 2em;
}

input, textarea {
  background-color: #00000;
  color: #0a0a23;
  border: 1px solid #0a0a23;
}

.inline {
  width: unset;
  margin: 0 0.5em 0 0;
  vertical-align: middle; 
}

input[type="submit"] {
  display: block;
  width: 60%;
  margin: 1em auto;
  height: 2em;
  font-size: 1.1rem;  
}




Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:109.0) Gecko/20100101 Firefox/111.0

Challenge: Survey Form - Build a Survey Form

Link to the challenge:

This is everything that came up when I clicked “run the tests”

  • You should have an h1 element with an id of title.

  • Waiting: Your #title should not be empty.

  • Waiting: You should have a p element with an id of description.

  • Waiting: Your #description should not be empty.

  • Waiting: You should have a form element with an id of survey-form.

  • Waiting: You should have an input element with an id of name.

  • Waiting: Your #name should have a type of text.

  • Waiting: Your #name should require input.

  • Waiting: Your #name should be a descendant of #survey-form.

  • Waiting: You should have an input element with an id of email.

  • Waiting: Your #email should have a type of email.

  • Waiting: Your #email should require input.

  • Waiting: Your #email should be a descendant of #survey-form.

  • Waiting: You should have an input element with an id of number.

  • Waiting: Your #number should be a descendant of #survey-form.

  • Waiting: Your #number should have a type of number.

  • Waiting: Your #number should have a min attribute with a numeric value.

  • Waiting: Your #number should have a max attribute with a numeric value.

  • Waiting: You should have a label element with an id of name-label.

  • Waiting: You should have a label element with an id of email-label.

  • Waiting: You should have a label element with an id of number-label.

  • Waiting: Your #name-label should contain text that describes the input.

  • Waiting: Your #email-label should contain text that describes the input.

  • Waiting: Your #number-label should contain text that describes the input.

  • Waiting: Your #name-label should be a descendant of #survey-form.

  • Waiting: Your #email-label should be a descendant of #survey-form.

  • Waiting: Your #number-label should be a descendant of #survey-form.

  • Waiting: Your #name should have a placeholder attribute and value.

  • Waiting: Your #email should have a placeholder attribute and value.

  • Waiting: Your #number should have a placeholder attribute and value.

  • Waiting: You should have a select field with an id of dropdown.

  • Waiting: Your #dropdown should have at least two selectable (not disabled) option elements.

  • Waiting: Your #dropdown should be a descendant of #survey-form.

  • Waiting: You should have at least two input elements with a type of radio (radio buttons).

  • Waiting: You should have at least two radio buttons that are descendants of #survey-form.

  • Waiting: All your radio buttons should have a value attribute and value.

  • Waiting: All your radio buttons should have a name attribute and value.

  • Waiting: Every radio button group should have at least 2 radio buttons.

  • Waiting: You should have at least two input elements with a type of checkbox (checkboxes) that are descendants of #survey-form.

  • Waiting: All your checkboxes inside #survey-form should have a value attribute and value.

  • Waiting: You should have at least one textarea element that is a descendant of #survey-form.

  • Waiting: You should have an input or button element with an id of submit.

  • Waiting: Your #submit should have a type of submit.

Waiting: Your #submit should be a descendant of #survey-form.

You might try moving the “h1” and “p” elements out of the head element. I wonder if the test is looking for them in the “body” and not finding them there.

Ok, thanks. I will try that.

I fixed this and refreshed the page and now it is showing what I need to fix. Thanks!

1 Like

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