Tell us what’s happening:
I am continuing to get the error stating " All your checkboxes inside #survey-form
should have a value
attribute and value." Please help!
Your code so far
<!-- file: index.html -->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Gaming Survey Form</title>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<h1 id="title">Gaming Survey Form</h1>
<p id="description">Thank you for helping make the gaming community better.</p>
<form id="survey-form">
<div class="form-group">
<label id="name-label" for="name">Name</label>
<input id="name" type="text" name="name" class="form-control" placeholder="Name" required></input>
</div>
<div class="form-group">
<label id="email-label" for="email">Email</label>
<input id="email" type="email" name="email" class="form-control" placeholder="Email" required></input>
</div>
<div class="form-group">
<label id="number-label" for="number">Age (optional)</label>
<input id="number" type="number" name="age" min="13" max="99" class="form-control" placeholder="Age"></input>
</div>
<div class="form-group">
<p>Select your favorite type of game.</p>
<select id="dropdown" name="gametype" class="form-control" required>
<option disabled selected value>Select Game Style</option>
<option value="adventure">Adventure</option>
<option value="fps">First-Person Shooter</option>
<option value="fighting">Fighting</option>
<option value="horror">Horror</option>
<option value="br">Battle Royale</option>
</select>
</div>
<div class="form-group">
<p>Are you happy with the current state of gaming?</p>
<label>
<input name="gaming-state" value="yes" type="radio" class="input-radio">Yes</input>
</label>
<label>
<input name="gaming-state" value="no" type="radio" class="input-radio">No</input>
</label>
<label>
<input name="gaming-state" value="not-sure" type="radio" class="input-radio">Not Sure</input>
</label>
</div>
<div class="form-group">
<p>Which of these games have you recently played?
<span class="clue">(Check all that apply)</span></p>
<label>
<input id="recently-played" name="recently-played value="fortnite" type="checkbox" class="input-checkbox">Fortnite</input>
</label>
<label>
<input id="recently-played" name="recently-played value="halo" type="checkbox" class="input-checkbox">Halo</input>
</label>
<label>
<input id="recently-played" name="recently-played value="warzone" type="checkbox" class="input-checkbox">Warzone</input>
</label>
<label>
<input id="recently-played" name="recently-played value="minecraft" type="checkbox" class="input-checkbox">Minecraft</input>
</label>
<label>
<input id="recently-played" name="recently-played value="roblox" type="checkbox" class="input-checkbox">Roblox</input>
</label>
</div>
<div>
<p>What would you like to see improved?</p>
<textarea id="comments" class="input-textarea" name="comment" placeholder="Enter your comments here..."></textarea>
</div>
<div class="form-group">
<input id="terms-and-conditions" type="checkbox" required name="terms-and-conditions" value="terms-and-conditions"/>I accept the<a href="#"> terms and conditions</a>
<button type="submit" id="submit" class="submit-button">Submit</button>
</div>
</form>
</body>
</html>
/* file: styles.css */
Your browser information:
User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/122.0.0.0 Safari/537.36
Challenge Information:
Survey Form - Build a Survey Form