**Tell us what’s happening: I am struggling to see what I am missing with these name, email, and number labels. Also adding values to the radio buttons and checkbox’s.
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.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Survey Form</title>
<link rel="stylesheet" href="styles.css" />
</head>
<body>
<h1 id="title">freeCodeCamp Survey Form</h1>
<p id="description">Thank you for taking the time to help us improve the platform</p>
<form method="post" action='https://register-demo.freecodecamp.org'id="survey-form">
<fieldset>
<label for="name">Name <input id="name" name="name" type="text" placeholder="name" required /></label>
<label for="email">Email <input id="email" name="email" type="email" required placeholder="email"/></label>
<label for="number">Age (optional) <input id="number" type="number" name="number" min="10" max="99" placeholder="10"/></label>
<label for="current-role">Which option best describes your current role?
<select id="dropdown" name="dropdown">
<option value="">Select current role</option>
<option value="1">Student</option>
<option value="2">Full Time Job</option>
<option value="3">Full Time Learner</option>
<option value="4">Prefer Not To Say</option>
<option value="5">Other</option>
</select>
</label>
<label for="recommend">Would you recommend freeCodeCamp to a friend?</label>
<input id="definitely" type="radio" name="recommend" class="inline" /> Definitely</label>
<label for="maybe"><input id="maybe" type="radio" name="recommend" class="inline" /> Maybe</label>
<label for="not-sure">
<input id="not-sure" type="radio" name="recommend" class="inline" /> Not Sure
</label>
<label for="favorite-feature">What is your favorite feature of freeCodeCamp?
<select id="referrer" name="referrer">
<option value="">Select an option</option>
<option value="1">Challenges</option>
<option value="2">Projects</option>
<option value="3">Community</option>
<option value="4">Open Source</option>
</select>
</label>
<label for="improvement">What would you like to see improved? (Check al that apply)
</label>
<label for="front-end-projects">
<input id="front-end-projects" type="checkbox" name="improvement" class="inline">Front-end Projects
</label>
<label for="back-end-projects">
<input id="back-end-projects" type="checkbox" name="improvement" class="inline">Back-end Projects</label>
<label for="data-visualiztion"><input id="data-visualization"type="checkbox" name="improvement" class="inline">Data Visualization</label>
<label for="challenges"><input id="challenges" type="checkbox" name="improvement" class="inline">Challenges</label>
<label for="open-source">
<input id="open-source" type="checkbox" name="improvement" class="inline">Open Source Community</label>
<label for="help-room"><input id="help-room" type="checkbox" name="improvement" class="inline">Gitter help rooms</label>
<label for="videos"><input id="videos" type="checkbox" name="improvement" class="inline">Videos</label>
<label for="meetups"><input id="meetups" type="checkbox" name="improvement" class="inline">City Meetups</label>
<label for="wiki"><input id="wiki" type="checkbox" name="improvement" class="inline">Wiki</label>
<label for="forum"><input id="forum" type="checkbox" name="improvement" class="inline">Forum</label>
<label for="add-courses"><input id="add-courses" type="checkbox" name="improvement" class="inline">Additional Courses</label>
<label for="comments">Any comments or suggestions?</label><textarea id="bio" name="bio" rows="5" cols="45" placeholder="Enter your comments here..."></textarea>
</fieldset>
<input type="submit" value="Submit" />
</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/109.0.0.0 Safari/537.36
Challenge: Survey Form - Build a Survey Form
Link to the challenge:
“You should have a label element with an id of name-label.”
Do you have a label element with the id set to name-label?
But I already have my name label id as name. and I don’t have any more name labels to make one id as both “name” and name-label"
both are requested in the item list
According to the HTML you pasted above, you have an input with the id of name. The associated label for that input does not have an id at all, although it does have a for attribute. I’m not sure why you can’t add an id of name-label to that label?
thanks for your replies, I am very new to coding. Do I even need that for=“name” element?
Even though you are nesting your inputs within a label it is still considered best practice to add the for attribute on the label. So I would say yes, you should have a for attribute on every label.
Does that bind it to the inputs name or id?
The for attribute on the label should be set to the id of its associated input.
and as far as values go, you cannot repeat the same value numbers within a form correct?
For example I have different questions for different input types seperated on the form.
Which way is correct?
WAY 1 WAY 2
QUESTION1:
Ans1: input value=“” “”
Ans2: input value=“1” “1”
Ans3: input value=“2” “2”
QUESTION2:
Ans1: input value=“3” “”
Ans2: input value=“4” “1”
Ans3: input value=“5” “2”
QUESTION3:
Ans1: input value= “6” “”
Ans2: input value= “7” “1”
Ans3: input value= “8” “2”
Not quite correct. There is no restriction on values. You can put whatever values you want on the inputs. You can have a question with 50 check boxes and they can all have the same value if you like. I’m not sure that would be very helpful to you, but you can certainly do it 
lol right so the value 2 will associate answer 3 for every question in WAY 2?
way 2 of my horibble example, lol i spaced it out to make snese but when it posted it tightened up
Think of it this way. What if you had a form with a bunch of yes/no questions. Each question consists of two radio buttons, one with the value of “no” and the other with the value of “yes” (or perhaps 0 and 1 if you prefer). That is perfectly acceptable. But you need a way to determine which question each of those answers goes with. The name attribute can help you there. Give each of the yes/no radio button groupings a unique name attribute and then when you are processing the answers you will know which answer is for which question.
I know it might seem a little hard to fully comprehend how this will work since you aren’t actually processing the user’s answers right now. That will come when you’ve learned some javascript.
Ok but it is saying I have not applied values to radio and checkboxes still…
///text
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Survey Form</title>
<link rel="stylesheet" href="styles.css" />
</head>
<body>
<h1 id="title">freeCodeCamp Survey Form</h1>
<p id="description">Thank you for taking the time to help us improve the platform</p>
<form method="post" action='https://register-demo.freecodecamp.org'id="survey-form">
<fieldset>
<label id="name-label" for="name">Name <input id="name" name="name" type="text" placeholder="name" required/></label>
<label id="email-label" for="email">Email <input id="email" name="email" type="email" required placeholder="email"/></label>
<label id="number-label" for="number">Age (optional) <input id="number" type="number" name="number" min="10" max="99" placeholder="10"/></label>
<label for="current-role">Which option best describes your current role?
<select id="dropdown" name="dropdown">
<option value="">Select current role</option>
<option value="1">Student</option>
<option value="2">Full Time Job</option>
<option value="3">Full Time Learner</option>
<option value="4">Prefer Not To Say</option>
<option value="5">Other</option>
</select>
</label>
<label for="recommend">Would you recommend freeCodeCamp to a friend?</label>
<input id="definitely" type="radio" name="recommend" class="inline" value=""/> Definitely</label>
<label for="maybe"><input id="maybe" type="radio" name="recommend" class="inline" value="1"/> Maybe</label>
<label for="not-sure">
<input id="not-sure" type="radio" name="recommend" class="inline" value="2"/> Not Sure
</label>
<label for="favorite-feature">What is your favorite feature of freeCodeCamp?
<select id="referrer" name="referrer">
<option value="">Select an option</option>
<option value="1">Challenges</option>
<option value="2">Projects</option>
<option value="3">Community</option>
<option value="4">Open Source</option>
</select>
</label>
<label for="improvement">What would you like to see improved? (Check al that apply)
</label>
<label for="front-end-projects">
<input id="front-end-projects" type="checkbox" name="improvement" class="inline">Front-end Projects
</label>
<label for="back-end-projects">
<input id="back-end-projects" type="checkbox" name="improvement" class="inline">Back-end Projects</label>
<label for="data-visualiztion"><input id="data-visualization"type="checkbox" name="improvement" class="inline">Data Visualization</label>
<label for="challenges"><input id="challenges" type="checkbox" name="improvement" class="inline">Challenges</label>
<label for="open-source">
<input id="open-source" type="checkbox" name="improvement" class="inline">Open Source Community</label>
<label for="help-room"><input id="help-room" type="checkbox" name="improvement" class="inline" value="">Gitter help rooms</label>
<label for="videos"><input id="videos" type="checkbox" name="improvement" class="inline" value="1">Videos</label>
<label for="meetups"><input id="meetups" type="checkbox" name="improvement" class="inline" value="2"
>City Meetups</label>
<label for="wiki"><input id="wiki" type="checkbox" name="improvement" class="inline" value="3">Wiki</label>
<label for="forum"><input id="forum" type="checkbox" name="improvement" class="inline" value="4">Forum</label>
<label for="add-courses"><input id="add-courses" type="checkbox" name="improvement" class="inline" value="5">Additional Courses</label>
<label for="comments">Any comments or suggestions?</label><textarea id="bio" name="bio" rows="5" cols="45" placeholder="Enter your comments here..."></textarea>
</fieldset>
<input id="submit" type="submit" value="Submit" />
</form>
</body>
</html>
///
I’m guessing the tests don’t consider an empty value to count as a value.
oh that is how the course before this taught me how to do it. is 0 an accepted value?
I’m just guessing here. I actually didn’t test your HTML because you didn’t quite paste it all in correctly. So I don’t know if that is actually the problem. You’ll just have to try things until you figure out what the tests want.
1 Like
I’ve edited your code 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 (').
1 Like
