Lab3/form.html at main · tahilg71/Lab3 · 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
<!--
=========================================================
Name        : form.html
Assignment  : Lab 3 Exercise C
Author(s)   : Jaisumer Sandhu, Tahil Goyal
Submission  : Jan 31, 2024
Description : A simple HTML file for form tag.
=========================================================
-->
<!DOCTYPE html>
<html>
<head>
    <title>Form Elements Demonstration</title>
</head>
<body>
    <h1>HTML Form Elements Demo</h1>

    <form action="#" method="post">
        <fieldset>
            <legend>Personal Information</legend>
            <label for="'Name">Name:</label><br>
            <input type="text" id="Name" name="Name"><br>
            <label for="email">Email:</label><br>
            <input type="email" id="email" name="email"><br>
            <label for="'Password">Password:</label><br>
            <input type="password" id="Password" name="Password"><br>
        </fieldset>

        <fieldset>
            <legend>Choice Elements</legend>
            <p>Gender:</p>
			<input type="radio" id="male" name="gender" value="male">
            <label for="male">Male</label><br>
            <input type="radio" id="Female" name="gender" value="Female">
            <label for="Female">Female</label><br>
            <input type="radio" id="Other" name="gender" value="Other">
            <label for="Other">Other</label><br><br>

            <label for="fruits">Choose a fruit:</label><br>
            <select id="fruits" name="fruits" size="5">
				<option value="apple">Apple</option>
                <option value="Orange">Orange</option>
                <option value="Banana">Banana</option>
                <option value="Peaches">Peaches</option>
                <option value="Grapes">Grapes</option>
                <option value="Pomegranate">Pomegranate</option>
                <option value="Watermelon">Watermelon</option>
                <option value="Cantelope">Cantelope</option>
                <option value="Strawberry">Strawberry</option>
                <option value="Kiwi">Kiwi</option>
                <option value="Mango">Mango</option>
            </select><br>
        </fieldset>

        <fieldset>
            <legend>Other Elements</legend>
            <label for="Birthday" id="Birthday">Birthday:</label><br>
            <input type="date" id="Birthday" name="Birthday"><br>
            <label for="favcolor">Favorite Color:</label><br>
            <input type="color" id="favcolor" name="favcolor"><br>
            <label for="Quantity" id="Quantity" name="Quantity">Quantity (between 1 and 5):</label><br>
            <input type="number" id="Quantity" name="Quantity" min="1" max="5"><br>
            <label for="range">Range (between 1 and 10):</label><br>
            <input type="range" id="range" name="range" min="1" max="10" value="2"><br>
            <label for="Homepage">Homepage: </label><br>
            <input type="url" id="Homepage" name="Homepage"><br>
            <label for="feedback">Feedback:</label><br>
			<textarea id="feedback" name="feedback" rows="12" cols="90"></textarea><br>
            <input type="file" id="myfile" name="file"><br>
            <input type="checkbox" id="Sub2News" name="Sub2News">
            <label for="Sub2News">Subscribe to newsletter</label><br>
            <input type="hidden" id="customerId" name="customerId" value="12345">
            <input type="submit" value="Submit">
            <input type="reset" value="Reset">
        </fieldset>
    </form>

</body>
</html>