Failed:All your checkboxes inside #survey-form should have a value attribute and value..... how do i fix this?

Tell us what’s happening:
Describe your issue in detail here.

  **Your code so far**
/* file: index.html */
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Survey FOrm</title>
<link rel="stylesheet" href="survey.css">
</head>
<body>
<h1 id="title"> SURVEY FORM</h1>
<p id=description>
This form below is a survey form
<p>
<div class="container">
<form id="survey-form">
<label id="name-label">Name</label><br>
 <input type="text" id="name" class="name" placeholder="enter your name" required><br><br>
  <label id="email-label">Email</label><br>
 <input type="email" id="email"  class="name" placeholder="enter your email" required><br><br>
  <label id="number-label">Age(optional)</label><br>
 <input type="number" id="number"  class="name" placeholder="Age" min="18" max="50"><br><br>
  <labe id="name-label">Which option best describes your current role?</labe><br>
  <select id="dropdown"> 
    <option value="select role">Select Current Role</option>
    <option value="Student">Student</option>
    <option value="full time learner">Full Time Learner</option>
    <option value="prefer not to say">Prefer Not To Say</option>
    <option value="others">Others</option>
 </select><br><br>
 <p>Would you recommend freeCodeCamp to a friend?</p><br>
 <input type="radio" id="definitely" name="response" value="definitely">
  <label for="definitely">Definitely</label>
  <input type="radio" id="maybe" name="response" value="maybe">
  <label for="maybe">Maybe</label>
  <input type="radio" id="not sure" name="response" value="not sure">
  <label for="not sure">Not Sure</label><br><br>

<p>What is your favorite feature of freeCodeCamp?</p>
<input type="checkbox" name="value" id="value" valaue="front-end projects">
<label> Front-end Projects</label><br>
<input type="checkbox"  name="value" id="value"  value="back-end projects">
<label>Back-end Projects</label><br>
<input type="checkbox"  name="value" id="value"  value="Data visualization">
<label>Data Visualization</label><br>
<input type="checkbox"  name="value" id="value"   value="challanges">
<label>Challenges</label><br>
<input type="checkbox"  name="value" id="value"  value="open source community">
<label>Open Source Community</label><br>
<input type="checkbox"  name="value"  id="value" value="gitter help rooms">
<label>Gitter help rooms</label><br>
<input type="checkbox"  name="value" id="value"  value="videos">
<label>Videos</label><br>
<input type="checkbox"  name="value"  id="value" value="wiki">
<label>Wiki</label><br>
<input type="checkbox"  name="value" id="value" value="forum">
<label>Forum</label><br>
<input type="checkbox"  name="value"  id="value" value="city meetups">
<label>City Meetups</label><br>
<p>Any comments or suggestions?</p>
<textarea>Enter your comment here</textarea><br><br>
<button id="submit">Submit</button>
</form>

</div>


</body>
</html>
/* file: styles.css */
*{
padding: 0;
margin: 0;
box-sizing: border-box;
}
body{
width: 100vw;
background-color: #2A2A49;
overflow-x: hidden;
}
.container{
width: 40%;
background-color:#2A2A49 ;
margin-left: 30px;
}
h1{
width: 100%;
height: 100px;
margin: 30px 0 0 150px;
font-family: sans-serif;

}
#description{
font-family: sans-serif;
font-style: oblique;
margin: 0 0 20px 30px;
}
.mike{
font-family: sans-serif;
color: aliceblue;
margin-top: 20px;
}
input[class=name]{
width: 100%;
padding: 12px 20px;
margin: 8px 0;
display: inline-block;
border: 1px solid #ccc;
border-radius: 4px;}

input[type=radio]{
  width: 15px;
  font-size: 20px;
}
label{
  font-family: sans-serif;
  font-size: 1.3em;
  font-weight: lighter;
}
p{
  font-family:sans-serif;
  font-size: 1.5em;
  margin: 15px 0 20px 0;
}
#dropdown, button, textarea{
  width: 100%;
padding: 12px 20px;
margin: 8px 0;
display: inline-block;
border: 1px solid #ccc;
border-radius: 4px;}
textarea{
  height: 150px;
}

button{
  background-color: #37AF65;
}


  **Your browser information:**

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

Challenge: Build a Survey Form

Link to the challenge:

When you think something should work and it doesn’t then a lot of times it’s just a silly little typo you aren’t seeing. This is one of those times :slight_smile: You know it has to do with the value attribute on the check boxes. Go over each one carefully. Widen the HTML editor so all the value attributes line up and I think you’ll see it.

<input type="checkbox" name="value" id="value" valaue="front-end projects">```

The problem was that "valaue"

i added value attribute in checkboxes but still it showing me wrong

2 Likes

Yeah, same for me. I added the value attribute to the tags just like the prompt stated, yet I’m still being thrown an error. I got everything else correct; however, I think it’s the way the website parses the HTML markup.

We can’t help you without seeing your HTML. The best way to do this is to use the “Ask for Help” button in the step. This will automatically add your current HTML to the post.

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