Spaces:
Running
Running
Upload 2 files
Browse files- index.html +65 -0
- thanks.html +34 -0
index.html
ADDED
|
@@ -0,0 +1,65 @@
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 1 |
+
<!DOCTYPE html>
|
| 2 |
+
<html lang="en">
|
| 3 |
+
<head>
|
| 4 |
+
<meta charset="UTF-8">
|
| 5 |
+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
| 6 |
+
<title>Website đặt chỗ</title>
|
| 7 |
+
</head>
|
| 8 |
+
<body>
|
| 9 |
+
<h1>Thông tin dặt chỗ</h1>
|
| 10 |
+
<form>
|
| 11 |
+
<label for="numGuest">Số khách tham dự bữa tiệc của quý khách: </label>
|
| 12 |
+
<input type="number" name="numGuest" id="numGuest">
|
| 13 |
+
|
| 14 |
+
<label for="date">Ngày đặt: </label>
|
| 15 |
+
<input type="date" name="date" id="date">
|
| 16 |
+
<br>
|
| 17 |
+
<label>Loại tiệc</label>
|
| 18 |
+
<input type="radio" name="partyType" id="breakfast" value="breakfast">
|
| 19 |
+
<label for="breakfast">Tiệc sáng</label>
|
| 20 |
+
<input type="radio" name="partyType" id="lunch" value="lunch">
|
| 21 |
+
<label for="lunch">Tiệc trưa</label>
|
| 22 |
+
<input type="radio" name="partyType" id="dinner" value="dinner">
|
| 23 |
+
<label for="dinner">Tiệc tối</label>
|
| 24 |
+
<br>
|
| 25 |
+
<label for="age">Độ tuổi </label>
|
| 26 |
+
<select name="age" id="age">
|
| 27 |
+
<option value="under18">Dưới 18 tuổi</option>
|
| 28 |
+
<option value="over18">Trên 18 tuổi</option>
|
| 29 |
+
</select>
|
| 30 |
+
|
| 31 |
+
<label>Giới tính: </label>
|
| 32 |
+
<input type="radio" name="gender" id="male">
|
| 33 |
+
<label for="male">Nam</label>
|
| 34 |
+
<input type="radio" name="gender" id="female">
|
| 35 |
+
<label for="female">Nữ</label>
|
| 36 |
+
<br>
|
| 37 |
+
<label for="referral">Quý khách biết tới chúng tôi qua: </label>
|
| 38 |
+
<select name="referral" id="referral">
|
| 39 |
+
<option value="news">Báo chí</option>
|
| 40 |
+
<option value="google">Goolge</option>
|
| 41 |
+
<option value="youtube">Youtube</option>
|
| 42 |
+
<option value="facebook">Facebook</option>
|
| 43 |
+
</select>
|
| 44 |
+
<br>
|
| 45 |
+
<label for="requests">Các yêu cầu của quý khách: </label>
|
| 46 |
+
<br>
|
| 47 |
+
<textarea name="requests" id="requests" cols="100" rows="10"></textarea>
|
| 48 |
+
<br>
|
| 49 |
+
<button type="button" onclick="submitBooking()">Dặt chỗ</button>
|
| 50 |
+
</form>
|
| 51 |
+
</body>
|
| 52 |
+
<script>
|
| 53 |
+
function submitBooking() {
|
| 54 |
+
const numGuest = document.getElementById("numGuest").value;
|
| 55 |
+
const date = document.getElementById("date").value;
|
| 56 |
+
const partyType = document.querySelector('input[name="partyType"]:checked').value;
|
| 57 |
+
const age = document.getElementById("age").value;
|
| 58 |
+
const gender = document.querySelector('input[name="gender"]:checked').value;
|
| 59 |
+
const referral = document.getElementById("referral").value;
|
| 60 |
+
const requests = document.getElementById("requests").value;
|
| 61 |
+
|
| 62 |
+
window.location.href = "./thanks.html?numGuest=" + numGuest + "&date=" + date + "&partyType=" + partyType + "&age=" + age + "&gender=" + gender + "&referral=" + referral + "requests=" + encodeURIComponent(requests);
|
| 63 |
+
}
|
| 64 |
+
</script>
|
| 65 |
+
</html>
|
thanks.html
ADDED
|
@@ -0,0 +1,34 @@
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 1 |
+
<!DOCTYPE html>
|
| 2 |
+
<html lang="en">
|
| 3 |
+
<head>
|
| 4 |
+
<meta charset="UTF-8">
|
| 5 |
+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
| 6 |
+
<title>Thanks for Booking</title>
|
| 7 |
+
</head>
|
| 8 |
+
<body>
|
| 9 |
+
<h1>Cảm ơn quý khách hàng đã đặt hàng của chúng tôi!</h1>
|
| 10 |
+
<h3>Thông tin quý khách đã đặt</h3>
|
| 11 |
+
<p id="bookingDetails"></p>
|
| 12 |
+
</body>
|
| 13 |
+
<script>
|
| 14 |
+
window.onload = function() {
|
| 15 |
+
const urlParams = new URLSearchParams(window.location.search);
|
| 16 |
+
const numGuest = urlParams.get("numGuest");
|
| 17 |
+
const date = urlParams.get("date");
|
| 18 |
+
const partyType = urlParams.get("partyType");
|
| 19 |
+
const age = urlParams.get("age");
|
| 20 |
+
const gender = urlParams.get("gender");
|
| 21 |
+
const referral = urlPagrams.get("referral");
|
| 22 |
+
const requests = decodeURIComponent(urlParams.get("requests"));
|
| 23 |
+
|
| 24 |
+
document.getElementById("bookingDetails").innerHTML =
|
| 25 |
+
"Số lượng khách đã đặt: " + numGuest + "<br>" +
|
| 26 |
+
"Ngày đặt: " + date + "<br>" +
|
| 27 |
+
"Loại tiệc: " + partyType + "<br>" +
|
| 28 |
+
"Độ tuổi: " + age + "<br>" +
|
| 29 |
+
"Giới tính: " + gender + "<br>" +
|
| 30 |
+
"Quý khách biết tới chúng tôi qua: " + referral + "<br>" +
|
| 31 |
+
"Các yêu cầu của quý khách: " + requests + "<br>";
|
| 32 |
+
}
|
| 33 |
+
</script>
|
| 34 |
+
</html>
|