--- id: 587d78af367417b2b2512b03 title: Crea un modulo di sondaggio challengeType: 3 forumTopicId: 301145 dashedName: build-a-survey-form --- # --description-- **Obiettivo:** Costruisci un'app [CodePen.io](https://codepen.io) funzionalmente simile a questa: . Soddisfa le seguenti [user story](https://en.wikipedia.org/wiki/User_story) e fai passare tutti i test. Usa il tuo stile personale. Puoi utilizzare HTML, JavaScript, e CSS per completare questo progetto. CSS è raccomandato perché è l'argomento delle lezioni viste finora e dovresti fare pratica con il CSS di base. Se lo desideri puoi anche utilizzare Bootstrap o SASS. Ulteriori tecnologie (solo per fare un esempio jQuery, React, Angular, o Vue) non sono raccomandate per questo progetto, e usarle è a tuo rischio. Altri progetti ti daranno la possibilità di lavorare con diversi stack tecnologici come React. Accetteremo e cercheremo di risolvere tutte le segnalazioni di problemi che utilizzano lo stack tecnologico suggerito per questo progetto. Happy coding! **User Story #1:** Posso vedere un titolo con `id="title"` in un testo di dimensioni H1. **User Story #2:** Posso vedere una breve spiegazione con `id="description"` in un testo di dimensione P. **User Story #3:** Posso vedere un `form` con `id="survey-form"`. **User Story #4:** All'interno del modulo, mi viene chiesto di inserire il mio nome in un campo con `id="name"`. **User Story #5:** All'interno del modulo, mi viene chiesto di inserire un'email in un campo con `id="email"`. **User Story #6:** Se inserisco un'email non formattata correttamente, vedrò un errore di validazione HTML5. **User Story #7:** All'interno del modulo, posso inserire un numero in un campo con `id="number"`. **User story #8:** Se inserisco caratteri non numerici nell'input di tipo number, vedrò un errore di validazione HTML5. **User story #9:** Se inserisco numeri al di fuori dell'intervallo dell'input numerico, che sono definiti dagli attributi `min` e `max`, vedrò un errore di validazione HTML5. **User story #10:** Per il nome, l'e-mail, e i campi di input numerici all'interno del modulo posso vedere le etichette corrispondenti che descrivono lo scopo di ogni campo con i seguenti id: `id="name-label"`, `id="email-label"`e `id="number-label"`. **User story#11:** Per i campi di input di nome, email e numero, posso vedere il testo segnaposto che mi dà una descrizione o delle istruzioni per ogni campo. **User story #12:** All'interno del modulo, posso selezionare un'opzione da un menu a discesa che ha un corrispondente `id="dropdown"`. **User story #13:** All'interno del modulo, posso selezionare un campo da uno o più gruppi di pulsanti di opzione. Ogni gruppo dovrebbe essere raggruppato usando l'attributo `name`. **User story #14:** All'interno del modulo, posso selezionare diversi campi da una serie di caselle di spunta, ciascuno dei quali deve avere un attributo `value`. **User story #15:** All'interno del modulo, mi viene presentata alla fine una `textarea`, per inserire ulteriori commenti. **User story #16:** All'interno del modulo, mi viene presentato un pulsante con `id="submit"` per inviare tutti i miei input. Puoi costruire il tuo progetto usando questo modello CodePen e facendo click su `Save` per creare il tuo pen. Oppure puoi usare questo link CDN per eseguire i test in qualsiasi ambiente tu voglia: `https://cdn.freecodecamp.org/testable-projects-fcc/v1/bundle.js` Una volta fatto, invia l'URL del tuo progetto di lavoro con tutti i suoi test superati. # --solutions-- ```html // solution required ```