-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
86 lines (71 loc) · 3.06 KB
/
index.html
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
<!DOCTYPE html>
<html>
<head>
<style>
body {
color: rgba(20, 1, 3, 0.776);
}
</style>
</head>
<body style="background-color: rgb(243, 237, 211);">
<h1>Customized T-shirt Order Form</h1>
<form action="/submit_order" method="post" onsubmit="return validateForm()">
<fieldset>
<h2>User Details</h2>
<label for="name">Name:</label>
<input type="text" id="name" name="name" required>
<label for="email">Email:</label>
<input type="email" id="email" name="email" required>
<label for="phone">Phone:</label>
<input type="tel" id="phone" name="phone" required>
<label for="address">Address:</label>
<textarea id="address" name="address" rows="4" required></textarea>
</fieldset>
<fieldset>
<h2>T-shirt Order Details</h2>
<label for="tagline">Tagline on the Shirt:</label>
<input type="text" id="tagline" name="tagline" required>
<label for="color">Color:</label>
<select id="color" name="color" required>
<option value="Red">Red</option>
<option value="White">White</option>
<option value="Black">Black</option>
<option value="Green">Green</option>
</select>
<label for="size">Size:</label>
<select id="size" name="size" required>
<option value="S">Small</option>
<option value="M">Medium</option>
<option value="L">Large</option>
<option value="XL">Extra Large</option>
</select>
<label for="quantity">Quantity:</label>
<input type="number" id="quantity" name="quantity" min="1" required>
<label for="delivery_date">Date of Delivery:</label>
<input type="date" id="delivery_date" name="delivery_date" required>
<label for="other_details">Other Details of Delivery:</label>
<textarea id="other_details" name="other_details" rows="4"></textarea>
<input type="submit" value="Place Order">
</fieldset>
</form>
<script>
function validateForm() {
// Add your validation logic here
var phoneInput = document.getElementById("phone");
if (phoneInput.value.length !== 9) {
alert("Phone number must be 9 digits long.");
return false;
}
// Add more validation as needed
// Generate receipt
var receipt = "Order Receipt\n";
receipt += "Name: " + document.getElementById("name").value + "\n";
receipt += "Email: " + document.getElementById("email").value + "\n";
// Add more order details to the receipt
receipt += "Date of Generation: " + new Date().toLocaleDateString() + "\n";
alert(receipt);
return true;
}
</script>
</body>
</html>