Build a Survey form

I edited my CSS, and I submitted the updated version, which one will be considered for the certificate project?

1 Like

I also have an error that says “value must be 10” in the number input? please help

1 Like

Hi @NOOBatWORK

So the forum can assist please post your full code.

Use the following method to post code to the forum:

  1. On a separate line type three back ticks.
  2. On a separate line paste your code.
  3. On the last line type three back ticks. Here is a single back tick `

Happy coding

1 Like
<link rel="stylesheet" href="styles.css">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<body>
<h1 id="title">Franco's Survey</h1>
<form id="survey-form">
<p id="description">Thank you for Choosing Franco's, To help us improve the Service Please Fill this Survey.</p>
<label for="name" id="name-label">Name:</label>
<input id="name" type="text" placeholder="Wiam Daher" required>
 <label for="email" id="email-label">Email:</label>
 <input id="email" type="email" placeholder="Maiwdyer@gmail.com"required>
<label for="number" id="number-label">Number:</label>
<input id="number" type="number" min="10" max="10" placeholder="0549112601"   required>
 <p id="menu">Which Meal did you Order?</p>
 <select id="dropdown">
   <option>select</option>
     <option>Kibbeh</option>
     <option>Arayes</option>
     <option>HotDogs</option>
     <option>Burger</option>
 </select>
 <p id="food-rate">How would you rate the meal?</p>
 <label for="rating"><input type="radio" name="rating" value="bad">Bad</label>
 <label for="rating"><input type="radio" name="rating" value="good" checked>Good</label>
 <p id="comment">Tell us in your own words!</p>
 <textarea>Leave a Comment...</textarea>
 <label>
<p id="experience-rate">From 1 to 5 Stars  How would you rate your overall experience:</p>
<label for="1">1</label>
<input value="1" type="checkbox">
<label for="2">2</label>
<input value="2"type="checkbox">
<label for="3">3</label>
<input value="3" type="checkbox">
<label for="4">4</label>
<input value="4" type="checkbox">
<label for="5">5</label>
<input value="5" type="checkbox" checked>
<button id="submit" type="submit">Submit</button>
</form>
</body>

min and max values are same. I think that is the issue.
@NOOBatWORK

1 Like

I changed the min value for the number, the error says "value must be less than or equal to 10.

<link rel="stylesheet" href="styles.css">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<body>
<h1 id="title">Franco's Survey</h1>
<form id="survey-form">
<p id="description">Thank you for Choosing Franco's, To help us improve the Service Please Fill this Survey.</p>
<label for="name" id="name-label">Name:</label>
<input id="name" type="text" placeholder="Wiam Daher" required>
 <label for="email" id="email-label">Email:</label>
 <input id="email" type="email" placeholder="Maiwdyer@gmail.com"required>
<label for="number" id="number-label">Number:</label>
<input id="number" type="number" min="10" max="10" placeholder="0549112601"   required>
 <p id="menu">Which Meal did you Order?</p>
 <select id="dropdown">
   <option>select</option>
     <option>Kibbeh</option>
     <option>Arayes</option>
     <option>HotDogs</option>
     <option>Burger</option>
 </select>
 <p id="food-rate">How would you rate the meal?</p>
 <label for="rating"><input type="radio" name="rating" value="bad">Bad</label>
 <label for="rating"><input type="radio" name="rating" value="good" checked>Good</label>
 <p id="comment">Tell us in your own words!</p>
 <textarea>Leave a Comment...</textarea>
 <label>
<p id="experience-rate">From 1 to 5 Stars  How would you rate your overall experience:</p>
<label for="1">1</label>
<input value="1" type="checkbox">
<label for="2">2</label>
<input value="2"type="checkbox">
<label for="3">3</label>
<input value="3" type="checkbox">
<label for="4">4</label>
<input value="4" type="checkbox">
<label for="5">5</label>
<input value="5" type="checkbox" checked>
<button id="submit" type="submit">Submit</button>
</form>
</body>
1 Like

Hi,
There is nothing wrong with your code. Just change the min or max values. They are the same which means the user has to enter 10 on the form. Change the max value to a higher number and it will work.
Hope this helps.

2 Likes

nope, didn’t work. maybe I should apply an attribute? I think it’s used in password inputs?

Idk, Your code passes for me though. It is important to know that the your form is just for design purposes here, not the functionality. If by “not working” you mean the form doesn’t submit, Then it’s totally fine but your form structure and design works which is enough for the project. If you want, you can add some more functionality to it, like when the submit button is clicked, show a success message…

1 Like
One more question, I wasn't satisfied with the survey form I submitted, will they consider my updated version?

Yeah sure,
You can update your code as much as you want.

1 Like