Form/quote.php

651 lines
36 KiB
PHP
Raw Permalink Normal View History

2024-05-21 03:32:34 +00:00
<!DOCTYPE html>
<head>
<meta charset="UTF-8" />
<title>Request a Demo Form</title>
<meta name="viewport" content="width=device-width,initial-scale=1" />
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css"
integrity="sha384-T3c6CoIi6uLrA9TneNEoa7RxnatzjcDSCmG1MXxSR1GAsXEV/Dwwykc2MPK8M2HN" crossorigin="anonymous">
<style>
input[type="number"] {
text-align: center;
}
.d-none {
display: none;
}
</style>
</head>
<body>
<?php
if ($_SERVER['REQUEST_METHOD'] === 'POST') {
if (!empty($_POST["send"])) {
$fname = !empty($_POST["first_name"]) ? htmlspecialchars($_POST["first_name"]) : "N/A";
$lname = !empty($_POST["last_name"]) ? htmlspecialchars($_POST["last_name"]) : "N/A";
$gender = !empty($_POST["gender"]) ? htmlspecialchars($_POST["gender"]) : "N/A";
$email = !empty($_POST["email"]) && filter_var($_POST["email"], FILTER_VALIDATE_EMAIL) ? htmlspecialchars($_POST["email"]) : "N/A";
$phone = !empty($_POST["phone"]) ? htmlspecialchars($_POST["phone"]) : "N/A";
$departure = !empty($_POST["departure_airport"]) ? htmlspecialchars($_POST["departure_airport"]) : "N/A";
$destination = !empty($_POST["destination_airport"]) ? htmlspecialchars($_POST["destination_airport"]) : "N/A";
$additional_req = !empty($_POST["additional_req"]) ? htmlspecialchars($_POST["additional_req"]) : "N/A";
$travel_type = !empty($_POST["travel_type"]) ? htmlspecialchars($_POST["travel_type"]) : "N/A";
if ($travel_type == 'One way') {
$s_departure_date = !empty($_POST["s_departure_date"]) ? htmlspecialchars($_POST["s_departure_date"]) : "N/A";
$s_flexibility_on_dep = !empty($_POST["s_flexibility_on_dep"]) ? htmlspecialchars($_POST["s_flexibility_on_dep"]) : "N/A";
} elseif ($travel_type == 'Round trip') {
$t_departure_date = !empty($_POST["t_departure_date"]) ? htmlspecialchars($_POST["t_departure_date"]) : "N/A";
$t_flexibility_on_dep = !empty($_POST["t_flexibility_on_dep"]) ? htmlspecialchars($_POST["t_flexibility_on_dep"]) : "N/A";
$t_return_date = !empty($_POST["t_return_date"]) ? htmlspecialchars($_POST["t_return_date"]) : "N/A";
$t_flexibility_on_return = !empty($_POST["t_flexibility_on_return"]) ? htmlspecialchars($_POST["t_flexibility_on_return"]) : "N/A";
} elseif ($travel_type == 'Multi city') {
$from = !empty($_POST["from"]) ? array_map('htmlspecialchars', $_POST["from"]) : [];
$to = !empty($_POST["to"]) ? array_map('htmlspecialchars', $_POST["to"]) : [];
$date = !empty($_POST["date"]) ? array_map('htmlspecialchars', $_POST["date"]) : [];
$flexibility = !empty($_POST["flexibility"]) ? array_map('htmlspecialchars', $_POST["flexibility"]) : [];
}
$adult = !empty($_POST["adult"]) ? htmlspecialchars($_POST["adult"]) : "N/A";
$children = !empty($_POST["children"]) ? htmlspecialchars($_POST["children"]) : "N/A";
$infant = !empty($_POST["infant"]) ? htmlspecialchars($_POST["infant"]) : "N/A";
$adult_gender = !empty($_POST["adult_gender"]) ? array_map('htmlspecialchars', $_POST["adult_gender"]) : [];
$adult_first_name = !empty($_POST["adult_first_name"]) ? array_map('htmlspecialchars', $_POST["adult_first_name"]) : [];
$adult_last_name = !empty($_POST["adult_last_name"]) ? array_map('htmlspecialchars', $_POST["adult_last_name"]) : [];
$children_gender = !empty($_POST["children_gender"]) ? array_map('htmlspecialchars', $_POST["children_gender"]) : [];
$children_first_name = !empty($_POST["children_first_name"]) ? array_map('htmlspecialchars', $_POST["children_first_name"]) : [];
$children_last_name = !empty($_POST["children_last_name"]) ? array_map('htmlspecialchars', $_POST["children_last_name"]) : [];
$children_dob = !empty($_POST["children_dob"]) ? array_map('htmlspecialchars', $_POST["children_dob"]) : [];
$infant_gender = !empty($_POST["infant_gender"]) ? array_map('htmlspecialchars', $_POST["infant_gender"]) : [];
$infant_first_name = !empty($_POST["infant_first_name"]) ? array_map('htmlspecialchars', $_POST["infant_first_name"]) : [];
$infant_last_name = !empty($_POST["infant_last_name"]) ? array_map('htmlspecialchars', $_POST["infant_last_name"]) : [];
$infant_dob = !empty($_POST["infant_dob"]) ? array_map('htmlspecialchars', $_POST["infant_dob"]) : [];
$toEmail = "deepakshresthadharan123@gmail.com";
$subject = "New Request for Quote";
$mailHeaders = "MIME-Version: 1.0" . "\r\n";
$mailHeaders .= "Content-type:text/html;charset=UTF-8" . "\r\n";
$mailHeaders .= "From: $fname $lname <$email>" . "\r\n";
$emailBody = "
<!DOCTYPE html>
<html lang='en'>
<head>
<meta charset='UTF-8'>
<meta name='viewport' content='width=device-width, initial-scale=1.0'>
<title>New Request for Quote</title>
<style>
body { font-family: Arial, sans-serif; margin: 0; padding: 0; background-color: #f4f4f9; }
.container { max-width: 600px; margin: 20px auto; background-color: #ffffff; box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); border-radius: 8px; overflow: hidden; }
.header { background-color: #007bff; color: white; text-align: center; padding: 20px; }
.header h2 { margin: 0; font-size: 24px; }
.body { padding: 20px; color: #333333; }
.body h3 { margin-top: 0; font-size: 18px; }
table { width: 100%; border-collapse: collapse; margin-top: 20px; }
table, th, td { border: 1px solid #dddddd; }
th, td { padding: 15px; text-align: left; font-size: 14px; }
th { background-color: #f2f2f2; }
.footer { background-color: #007bff; color: white; text-align: center; padding: 15px; border-top: 1px solid #dddddd; }
.footer p { margin: 0; font-size: 14px; }
</style>
</head>
<body>
<div class='container'>
<div class='header'>
<h2>New Request for Quote</h2>
</div>
<div class='body'>
<h3>Contact Details</h3>
<table>
<tr><th>Name</th><td>$gender $fname $lname</td></tr>
<tr><th>Email</th><td>$email</td></tr>
<tr><th>Phone</th><td>$phone</td></tr>
<tr><th>Travel Type</th><td>$travel_type</td></tr>";
if ($travel_type == 'One way') {
$emailBody .= "<tr><th>Departure Date</th><td>$s_departure_date</td></tr>
<tr><th>Flexibility on Departure</th><td>$s_flexibility_on_dep</td></tr>";
} elseif ($travel_type == 'Round trip') {
$emailBody .= "<tr><th>Departure Date</th><td>$t_departure_date</td></tr>
<tr><th>Flexibility on Departure</th><td>$t_flexibility_on_dep</td></tr>
<tr><th>Return Date</th><td>$t_return_date</td></tr>
<tr><th>Flexibility on Return</th><td>$t_flexibility_on_return</td></tr>";
} elseif ($travel_type == 'Multi city') {
foreach ($from as $key => $item) {
$emailBody .= "<tr><th>From</th><td>$from[$key]</td></tr>
<tr><th>To</th><td>$to[$key]</td></tr>
<tr><th>Date</th><td>$date[$key]</td></tr>
<tr><th>Flexibility</th><td>$flexibility[$key]</td></tr>";
}
}
$emailBody .= "<tr><th>No. of Adults</th><td>$adult</td></tr>
<tr><th>No. of Children</th><td>$children</td></tr>
<tr><th>No. of Infants</th><td>$infant</td></tr>
<tr><th>Additional Requirements</th><td>$additional_req</td></tr>";
if ($adult > 0) {
foreach ($adult_gender as $key => $adult) {
$emailBody .= "<tr><th>Adult Name</th><td>$adult_gender[$key] $adult_first_name[$key] $adult_last_name[$key]</td></tr>";
}
}
if ($children > 0) {
foreach ($children_gender as $key => $child) {
$emailBody .= "<tr><th>Child DOB</th><td>$children_dob[$key]</td></tr>
<tr><th>Child Name</th><td>$children_gender[$key] $children_first_name[$key] $children_last_name[$key]</td></tr>";
}
}
if ($infant > 0) {
foreach ($infant_gender as $key => $infant) {
$emailBody .= "<tr><th>Infant DOB</th><td>$infant_dob[$key]</td></tr>
<tr><th>Infant Name</th><td>$infant_gender[$key] $infant_first_name[$key] $infant_last_name[$key]</td></tr>";
}
}
$emailBody .= "
</table>
</div>
<div class='footer'>
<p>&copy; Flight Ticket Nepal.</p>
</div>
</div>
</body>
</html>
";
if (mail($toEmail, $subject, $emailBody, $mailHeaders)) {
$message = "Your contact information has been received successfully.";
} else {
$message = "Failed to send email. Please try again later.";
error_log("Mail failed to send.");
}
}
}
?>
<section>
<div class="container">
<div class="row">
<div class="col-lg-12">
<h2 class="text-center p-5">Request a Quote Form</h2>
</div>
<div class="col-lg-12">
<form id="quote-form" method="POST" class="needs-validation" novalidate>
<div class="card bg-light">
<div class="card-body p-5 rounded-3">
<?php if (!empty($message)) { ?>
<div style="color:green; padding-bottom: 30px;">
<strong><?php echo $message; ?></strong>
</div>
<?php } ?>
<div class="row gy-2">
<div class="col-lg-4">
<input class="form-control form-control-lg" type="text" name="departure_airport"
placeholder="Departure Airport" required>
<div class="invalid-feedback">Please enter departure airport</div>
</div>
<div class="col-lg-4">
<input class="form-control form-control-lg" type="text"
name="destination_airport" placeholder="Destination Airport" required>
<div class="invalid-feedback">Please enter destination airport</div>
</div>
<div class="col-lg-4">
<select id="travel-type" name="travel_type" class="form-select form-select-lg"
required>
<option value="" selected>Select Travel Type</option>
<option value="One way">One Way</option>
<option value="Round trip">Round Trip</option>
<option value="Multi city">Multicity</option>
</select>
<div class="invalid-feedback">Please select your travel type</div>
</div>
</div>
<!-- for one way travel type -->
<div class="row gy-2 mt-4 justify-content-center one-way d-none">
<div class="col-lg-3">
<label for="departure_date" class="form-label fs-5">Departure Date</label>
<input class="form-control form-control-lg" type="date" name="s_departure_date"
placeholder="Departure Date">
</div>
<div class="col-lg-3">
<label for="flexibility_on_dep" class="form-label fs-5">Flexibility on
Departure</label>
<select name="s_flexibility_on_dep" class="form-select form-select-lg">
<option value="" selected>None</option>
<option value="Not Flexible">Not Flexible</option>
<option value="+/- 1 Day">+/- 1 Day</option>
<option value="+/- 3 Days">+/- 3 Days</option>
<option value="+/- 1 Week">+/- 1 Week</option>
<option value="+/- 2 Weeks">+/- 2 Weeks</option>
</select>
</div>
</div>
<!-- for two way travel type -->
<div class="row gy-2 mt-4 round-trip d-none">
<div class="col-lg-3">
<label for="departure_date" class="form-label fs-5">Departure Date</label>
<input class="form-control form-control-lg" type="date" name="t_departure_date">
</div>
<div class="col-lg-3">
<label for="flexibility_on_dep" class="form-label fs-5">Flexibility on
Departure</label>
<select name="t_flexibility_on_dep" class="form-select form-select-lg">
<option value="" selected>None</option>
<option value="Not Flexible">Not Flexible</option>
<option value="+/- 1 Day">+/- 1 Day</option>
<option value="+/- 3 Days">+/- 3 Days</option>
<option value="+/- 1 Week">+/- 1 Week</option>
<option value="+/- 2 Weeks">+/- 2 Weeks</option>
</select>
</div>
<div class="col-lg-3">
<label for="return_date" class="form-label fs-5">Returning Date</label>
<input class="form-control form-control-lg" type="date" name="t_return_date">
</div>
<div class="col-lg-3">
<label for="flexibility_on_return" class="form-label fs-5">Flexibility on
Return</label>
<select name="t_flexibility_on_return" class="form-select form-select-lg">
<option value="" selected>None</option>
<option value="Not Flexible">Not Flexible</option>
<option value="+/- 1 Day">+/- 1 Day</option>
<option value="+/- 3 Days">+/- 3 Days</option>
<option value="+/- 1 Week">+/- 1 Week</option>
<option value="+/- 2 Weeks">+/- 2 Weeks</option>
</select>
</div>
</div>
<!-- for mulit-city -->
<div class="multi-city mt-4 mb-1 d-none">
<div class="row gy-2 mb-2">
<div class="col-lg-3">
<label for="from" class="form-label fs-5">From</label>
<input class="form-control form-control-lg" type="text" name="from[]"
placeholder="From">
</div>
<div class="col-lg-3">
<label for="to" class="form-label fs-5">To</label>
<input class="form-control form-control-lg" type="text" name="to[]"
placeholder="To">
</div>
<div class="col-lg-3">
<label for="date" class="form-label fs-5">Date</label>
<input class="form-control form-control-lg" type="date" name="date[]">
</div>
<div class="col-lg-3">
<label for="flexibility" class="form-label fs-5">Flexibility</label>
<select name="flexibility[]" class="form-select form-select-lg">
<option value="" selected>None</option>
<option value="Not Flexible">Not Flexible</option>
<option value="+/- 1 Day">+/- 1 Day</option>
<option value="+/- 3 Days">+/- 3 Days</option>
<option value="+/- 1 Week">+/- 1 Week</option>
<option value="+/- 2 Weeks">+/- 2 Weeks</option>
</select>
</div>
</div>
<div class="text-center mt-4">
<a href="javascript::void(0)"
class="btn btn-success btn-hover-success add-multi-city"> + Add
More</a>
</div>
</div>
<!-- Personal Information -->
<div class="row gy-4 mt-4">
<div class="col-lg-12 mb-4">
<h6 class="text-center text-muted">Name and Contact Details: Please fill in your
personal information for this form.</h5>
<div class="border border-dashed"></div>
</div>
<div class="col-lg-4">
<input class="form-control form-control-lg" type="text" name="first_name"
placeholder="First Name" required>
<div class="invalid-feedback">Please enter your first name</div>
</div>
<div class="col-lg-4">
<input class="form-control form-control-lg" type="text" name="last_name"
placeholder="Last Name" required>
<div class="invalid-feedback">Please enter your last name</div>
</div>
<div class="col-lg-4">
<select name="gender" class="form-select form-select-lg" required>
<option value="" selected>Select Gender</option>
<option value="Mr">Mr.</option>
<option value="Mrs">Mrs.</option>
<option value="Miss">Miss</option>
</select>
<div class="invalid-feedback">Please select your gender</div>
</div>
<div class="col-lg-4">
<input class="form-control form-control-lg" type="email" name="email"
placeholder="Email Address" required>
<div class="invalid-feedback">Please enter a valid email address</div>
</div>
<div class="col-lg-4">
<input class="form-control form-control-lg" type="text" name="phone"
placeholder="Contact Number" required>
<div class="invalid-feedback">Please enter valid phone number</div>
</div>
<div class="col-lg-4">
<input class="form-control form-control-lg" type="text" name="alternate_phone"
placeholder="Alternate Contact Number">
</div>
</div>
<!-- Passenger Details -->
<div class="row gx-5 gy-2 my-5 justify-content-center">
<div class="col-lg-12 mb-4">
<h6 class="text-center text-muted">When traveling, it's essential that the names
of all passengers match exactly what is stated on the passports they will be
using.</h6>
<div class="border border-dashed"></div>
</div>
<div class="col-lg-3">
<label for="adult-input" class="form-label fs-5">Number of Adults <span
class="text-danger">*</span></label>
<input id="adult-input" class="form-control form-control-lg" type="number"
name="adult" placeholder="0" min="0" max="10" required>
<p class="text-center text-muted mt-2">(Including you)</p>
</div>
<div class="col-lg-3">
<label for="children-input" class="form-label fs-5">Number of Children <span
class="text-danger">*</span></label>
<input id="children-input" class="form-control form-control-lg" type="number"
name="children" placeholder="0" min="0" max="5">
<p class="text-center text-muted mt-2">(Age 2-11)</p>
</div>
<div class="col-lg-3">
<label for="infant-input" class="form-label fs-5">Number of Infants <span
class="text-danger">*</span></label>
<input id="infant-input" class="form-control form-control-lg" type="number"
name="infant" placeholder="0" min="0" max="5">
<p class="text-center text-muted mt-2">(0-23 Months)</p>
</div>
</div>
<!-- Adult Table -->
<div class="row adult-information">
<table id="adult-table" class="table table-striped table-light">
<thead>
<tr>
<th colspan="3" class="text-center p-2 bg-secondary text-white">Adult
Information</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</div>
<!-- Children Table -->
<div class="row mt-3 children-information">
<table id="children-table" class="table table-striped table-light">
<thead>
<tr>
<th colspan="4" class="text-center p-2 bg-secondary text-white">Children
Information</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</div>
<!-- Infant Table -->
<div class="row mt-3 infant-information">
<table id="infant-table" class="table table-striped table-light">
<thead>
<tr>
<th colspan="4" class="text-center p-2 bg-secondary text-white">Infant
Information</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</div>
<div class="row mt-4">
<div class="col-lg-12">
<div class="form-floating">
<textarea class="form-control w-100"
placeholder="Leave any additional requests" id="textarea"
style="height: 150px" name="additional_req"></textarea>
<label for="textarea">Any additional requests</label>
</div>
</div>
</div>
</div>
</div>
<input name="send" value="send" type="hidden" />
<div class="text-center m-5">
<button type="submit" class="btn btn-primary rounded-2 btn-md">Request a Quote</button>
</div>
</form>
</div>
</div>
</div>
</section>
<script src="https://code.jquery.com/jquery-3.7.1.min.js"
integrity="sha256-/JqT3SQfawRcv/BIHPThkBvs0OEvtFFmqPF/lYI/Cxo=" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.min.js"
integrity="sha384-BBtl+eGJRgqQAUMxJ7pMwbEyER4l1g+O15P+16Ep7Q9Q+zqX6gSbd85u4mG4QzX+" crossorigin="anonymous">
</script>
<script>
(() => {
'use strict';
const forms = document.querySelectorAll('.needs-validation');
Array.from(forms).forEach(form => {
form.addEventListener('submit', event => {
if (!form.checkValidity()) {
event.preventDefault();
event.stopPropagation();
}
form.classList.add('was-validated');
}, false);
});
})();
$(document).ready(function () {
$('#quote-form')[0].reset();
$('#adult-input').val(1);
$('#adult-input').trigger('input');
});
$('#travel-type').change(function () {
let type = $(this).val();
if (type) {
if (type === 'One way') {
$('.one-way').removeClass('d-none');
$('.round-trip').addClass('d-none');
$('.multi-city').addClass('d-none');
} else if (type === 'Round trip') {
$('.round-trip').removeClass('d-none');
$('.one-way').addClass('d-none');
$('.multi-city').addClass('d-none');
} else {
$('.multi-city').removeClass('d-none');
$('.one-way').addClass('d-none');
$('.round-trip').addClass('d-none');
}
} else {
$('.one-way').addClass('d-none');
$('.round-trip').addClass('d-none');
$('.multi-city').addClass('d-none');
}
});
$(".add-multi-city").click(function () {
let clonedRow = $(".multi-city .row:last").clone();
$(".multi-city .row:last").before(clonedRow);
});
$('#adult-input').on('input', function () {
$('.adult-information').removeClass('d-none');
let numAdults = parseInt($(this).val());
if (!isNaN(numAdults) && numAdults > 0) {
let $tbody = $('#adult-table tbody');
$tbody.empty();
for (let i = 0; i < numAdults; i++) {
let row = `
<tr>
<td colspan="1">
<select name="adult_gender[]" class="form-select form-select-lg" required>
<option value="" selected>Select Gender</option>
<option value="Mr">Mr.</option>
<option value="Mrs">Mrs.</option>
<option value="Miss">Miss</option>
</select>
</td>
<td colspan="1">
<input class="form-control form-control-lg" type="text" name="adult_first_name[]" placeholder="First Name" required>
</td>
<td colspan="1">
<input class="form-control form-control-lg" type="text" name="adult_last_name[]" placeholder="Last Name" required>
</td>
</tr>
`;
$tbody.append(row);
}
} else {
$('.adult-information').addClass('d-none');
}
});
$('#children-input').on('input', function () {
$('.children-information').removeClass('d-none');
let numChildren = parseInt($(this).val());
if (!isNaN(numChildren) && numChildren > 0) {
let $tbody = $('#children-table tbody');
$tbody.empty();
for (let i = 0; i < numChildren; i++) {
let row = `
<tr>
<td colspan="1">
<select name="children_gender[]" class="form-select form-select-lg" required>
<option value="" selected>Select Gender</option>
<option value="Mr">Mr.</option>
<option value="Mrs">Mrs.</option>
<option value="Miss">Miss</option>
</select>
</td>
<td colspan="1">
<input class="form-control form-control-lg" type="text" name="children_first_name[]" placeholder="First Name" required>
</td>
<td colspan="1">
<input class="form-control form-control-lg" type="text" name="children_last_name[]" placeholder="Last Name" required>
</td>
<td colspan="1">
<input class="form-control form-control-lg" type="date" name="children_dob[]" required>
</td>
</tr>
`;
$tbody.append(row);
}
} else {
$('.children-information').addClass('d-none');
}
});
$('#infant-input').on('input', function () {
$('.infant-information').removeClass('d-none');
let numInfants = parseInt($(this).val());
if (!isNaN(numInfants) && numInfants > 0) {
let $tbody = $('#infant-table tbody');
$tbody.empty();
for (let i = 0; i < numInfants; i++) {
let row = `
<tr>
<td colspan="1">
<select name="infant_gender[]" class="form-select form-select-lg" required>
<option value="" selected>Select Gender</option>
<option value="Mr">Mr.</option>
<option value="Mrs">Mrs.</option>
<option value="Miss">Miss</option>
</select>
</td>
<td colspan="1">
<input class="form-control form-control-lg" type="text" name="infant_first_name[]" placeholder="First Name" required>
</td>
<td colspan="1">
<input class="form-control form-control-lg" type="text" name="infant_last_name[]" placeholder="Last Name" required>
</td>
<td colspan="1">
<input class="form-control form-control-lg" type="date" name="infant_dob[]" required>
</td>
</tr>
`;
$tbody.append(row);
}
} else {
$('.infant-information').addClass('d-none');
}
});
</script>
</body>
</html>