[text] travel now

Viewer

copydownloadembedprintName: travel now
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4.     <title>Travel Agency Software</title>
  5.     <style>
  6.         /* CSS styles for the software interface */
  7.         /* Add your own styles as needed */
  8.         body {
  9.             font-family: Arial, sans-serif;
  10.             margin: 0;
  11.             padding: 20px;
  12.         }
  13.         h1 {
  14.             color: #333;
  15.         }
  16.         form {
  17.             margin-bottom: 20px;
  18.         }
  19.         label {
  20.             display: block;
  21.             margin-bottom: 5px;
  22.         }
  23.         input[type="text"],
  24.         input[type="date"],
  25.         input[type="number"] {
  26.             width: 200px;
  27.             padding: 5px;
  28.             margin-bottom: 10px;
  29.         }
  30.         input[type="submit"] {
  31.             padding: 10px 20px;
  32.             background-color: #333;
  33.             color: #fff;
  34.             border: none;
  35.             cursor: pointer;
  36.         }
  37.     </style>
  38. </head>
  39. <body>
  40.     <h1>Travel Agency Software</h1>
  41.  
  42.     <form id="bookingForm">
  43.         <label for="guestName">Guest Name:</label>
  44.         <input type="text" id="guestName" name="guestName" required>
  45.  
  46.         <label for="arrivalDate">Arrival Date:</label>
  47.         <input type="date" id="arrivalDate" name="arrivalDate" required>
  48.  
  49.         <label for="departureDate">Departure Date:</label>
  50.         <input type="date" id="departureDate" name="departureDate" required>
  51.  
  52.         <label for="numGuests">Number of Guests:</label>
  53.         <input type="number" id="numGuests" name="numGuests" required>
  54.  
  55.         <input type="submit" value="Book Stay">
  56.     </form>
  57.  
  58.     <div id="bookingResult"></div>
  59.  
  60.     <script>
  61.         // JavaScript code for handling the form submission
  62.         document.getElementById("bookingForm").addEventListener("submit", function(event) {
  63.             event.preventDefault(); // Prevent the default form submission
  64.  
  65.             // Retrieve form values
  66.             var guestName = document.getElementById("guestName").value;
  67.             var arrivalDate = document.getElementById("arrivalDate").value;
  68.             var departureDate = document.getElementById("departureDate").value;
  69.             var numGuests = document.getElementById("numGuests").value;
  70.  
  71.             // Perform booking logic or send data to a server for processing
  72.  
  73.             // Display the booking result
  74.             var bookingResult = document.getElementById("bookingResult");
  75.             bookingResult.innerHTML = "<p>Booking successful!</p>";
  76.             bookingResult.innerHTML += "<p>Guest Name: " + guestName + "</p>";
  77.             bookingResult.innerHTML += "<p>Arrival Date: " + arrivalDate + "</p>";
  78.             bookingResult.innerHTML += "<p>Departure Date: " + departureDate + "</p>";
  79.             bookingResult.innerHTML += "<p>Number of Guests: " + numGuests + "</p>";
  80.         });
  81.     </script>
  82. </body>
  83. </html>
  84.  

Editor

You can edit this paste and save as new:


File Description
  • travel now
  • Paste Code
  • 02 Jun-2023
  • 2.8 Kb
You can Share it: