Survey Form: Build a Survey Form

Code Feedback
1

I have completed my survey form but don’t know how to continue as after running the test the code says "/**

  • Your test output will go here
    */"
    how then do I continue so that I can check if I have passed or I have gotten my certification
2

hello and welcome to fcc forum :slight_smile:

could you provide that “step url” and your “repl or codepen” link for it?!

thanks and happy learning :slight_smile:

3

https://www.freecodecamp.org/learn/2022/responsive-web-design/build-a-survey-form-project/build-a-survey-form

4

and share your attempted code for this as well, thanks :slight_smile:

5

Survey Form

Please help fill out the following form.

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

<label for="number" id="number-label">Age:</label>
<input type="number" id="number" name="age" min="18" max="100" placeholder="Enter your age" required><br>

<label for="dropdown">How did you hear about us?</label>
<select id="dropdown" name="how-heard">
  <option value="select-an-option">Select an option</option>
  <option value="social-media">Social Media</option>
  <option value="search-engine">Search Engine</option>
  <option value="referral-by-a-friend">Referral by a Friend</option>
  <option value="other">Other</option>
</select><br>

<label>Would you recommend freeCodeCamp to a friend?</label><br>
<label for="definitely"><input type="radio" id="definitely" name="recommendation" value="definitely">Definitely</label><br>
<label for="maybe"><input type="radio" id="maybe" name="recommendation" value="maybe">Maybe</label><br>
<label for="not-sure"><input type="radio" id="not-sure" name="recommendation" value="not-sure">Not sure</label><br>

<label for="favorite-feature">What is your favorite feature of freeCodeCamp?</label>
<select id="favorite-feature" name="favorite-feature">
  <option value="select-an-option">Select an option</option>
  <option value="challenges">Challenges</option>
  <option value="projects">Projects</option>
  <option value="community">Community</option>
  <option value="open-source">Open Source</option>
</select><br>

<label>What would you like to see improved? (Check all that apply)</label><br>
<label for="front-end-projects"><input type="checkbox" id="front-end-projects" name="improvements" value="front-end-projects">Front-end Projects</label><br>
<label for="back-end-projects"><input type="checkbox" id="back-end-projects" name="improvements" value="back-end-projects">Back-end Projects</label><br>
<label for="data-visualization"><input type="checkbox" id="data-visualization" name="improvements" value="data-visualization">Data Visualization</label><br>
<label for="additional-courses"><input type="checkbox" id="additional-courses" name="improvements" value="additional-courses">Additional Courses</label><br>

<label for="comments">Any additional comments?</label><br>
<textarea id="comments" name="comments" placeholder="Enter any additional comments here"></textarea><br>

<button type="submit" id="submit">Submit</button>
<!-- Your test output will go here -->
6

/* Global styles */
body {
font-family: Arial, sans-serif;
background-color: #800000;
padding: 20px;
margin: 0;
}

/* Form container */
#survey-form {
background-color: #008b8b;
border-radius: 5px;
padding: 20px;
max-width: 500px;
margin: 0 auto;

}

/* Form inputs */
input[type=“text”],
input[type=“email”],
input[type=“number”],
select,
textarea {
width: 100%;
padding: 10px;
margin-bottom: 10px;
border-radius: 3px;
border: 1px solid #ccc;
}

/* Radio buttons and checkboxes */
input[type=“radio”],
input[type=“checkbox”] {
margin-right: 5px;
}

/* Submit button */
#submit {
background-color: #4caf50;
color: #ffffff;
padding: 10px 20px;
border: none;
border-radius: 3px;
cursor: pointer;
margin: auto;
}

#submit:hover {
background-color: #45a049;
}

/* Labels */
label {
font-weight: bold;
}

/* Optional: Add some spacing between form sections */
form > * {
margin-bottom: 10px;
}

7

you need to follow along all those “given constraints” in test cases, currently you dont have many of those yet “un-met”

i would recommend you going through “User Stories” chronologically, it should be more effective in completing this step, happy learning :slight_smile:

8

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