SurveyForm/form.html at main · PriscilaCodrington/SurveyForm · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="style/style.css">
    <title>Survey Form Practice</title>
</head>
<body>
    <div id="contenedor">

    <header>
        <h1 id="title"><center>Movies's Survey Form</center></h1>
        <p id="description"><center>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Alias, reiciendis perferendis quae officiis fuga cumque sapiente, illo vero sequi assumenda tempore dolorum accusamus tempora. Culpa quod a sapiente provident voluptatem.</center></p>
    </header>

    <img src="https://ctrlr.org/wp-content/uploads/2021/11/fall-movies-index-1628968089.jpg" alt="Cinema-photo" width="800px">
    <br>

    <form id="survey-form">
        <label for="name" id="name-label">Name</label>
        <input id="name" type="text" placeholder="Enter your name">

        <br><br>


        <label for="email" id="email-label">Email</label>
        <input id="email" type="email" placeholder="Enter your email">

        <br><br>


        <label for="number" id="number-label">Age (min. 18)</label>
        <input id="age" type="number" placeholder="Enter your Age" min="18" max="100">


        <br><br>


        <p>Which option best describes your hobby level?</p>
              <select id="dropdown" name="role">
                <option disabled="" selected="" value="">Select</option>
                <option value="Newbie">Newbie</option>
                <option value="intermediate">Intermediate</option>
                <option value="experienced">Experienced</option>
              </select>


        <br>
        <br>


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


            <br>
            <br>

              <p> What kind of genres would you like to recommend? (Check all that apply)
              </p>

              <label><input name="prefer" value="History" type="checkbox" >History</label><br>
              <label><input name="prefer" value="Thriller" type="checkbox" >Thriller</label><br>
              <label><input name="prefer" value="Drama" type="checkbox" >Drama</label><br>
              <label><input name="prefer" value="Comedy" type="checkbox" >Comedy</label><br>
              <label><input name="prefer" value="Suspense" type="checkbox" >Suspense</label><br>
              <label><input name="prefer" value="Romance" type="checkbox" >Romance</label><br>
              <label><input name="prefer" value="Action" type="checkbox" >Action</label><br>
              <label><input name="prefer" value="Documentals" type="checkbox" >Documentals</label><br>
              <label><input name="prefer" value="Musicals" type="checkbox">Musicals</label><br>
              <label><input name="prefer" value="Animation" type="checkbox" >Animation</label><br>
              <label><input name="prefer" value="SciFi" type="checkbox" >SciFi</label><br>

              <br>
              <br>

              <p>Any comments about any movie that you like</p>
              <textarea id="comments" name="comment" placeholder="Enter your comment here..."></textarea>

              <br>
              <br>

              <button type="submit" id="submit"  formaction="thankyou.html">
                Submit
              </button>

          </form>
    </form>

    </div>
</body>
</html>