568 lines
24 KiB
PHP
568 lines
24 KiB
PHP
|
<?php
|
||
|
|
// Enhanced security headers
|
||
|
|
header('X-Content-Type-Options: nosniff');
|
||
|
|
header('X-Frame-Options: DENY');
|
||
|
|
header('X-XSS-Protection: 1; mode=block');
|
||
|
|
header('Strict-Transport-Security: max-age=31536000; includeSubDomains');
|
||
|
|
header('Referrer-Policy: strict-origin-when-cross-origin');
|
||
|
|
|
||
|
|
$page_title = "Get a Quote | UK Data Services - Professional Data Solutions";
|
||
|
|
$page_description = "Get a free, no-obligation quote for your data project. Tell us your requirements and we'll provide a detailed proposal within 24 hours.";
|
||
|
|
$canonical_url = "https://ukdataservices.co.uk/quote.php";
|
||
|
|
?>
|
||
|
|
<!DOCTYPE html>
|
||
|
|
<html lang="en">
|
||
|
|
<head>
|
||
|
|
<meta charset="UTF-8">
|
||
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
|
|
<title><?php echo htmlspecialchars($page_title); ?></title>
|
||
|
|
<meta name="description" content="<?php echo htmlspecialchars($page_description); ?>">
|
||
|
|
<meta name="keywords" content="data quote, web scraping quote, data extraction pricing, business intelligence cost, UK data services pricing">
|
||
|
|
<meta name="author" content="UK Data Services">
|
||
|
|
<meta name="robots" content="index, follow">
|
||
|
|
<link rel="canonical" href="<?php echo htmlspecialchars($canonical_url); ?>">
|
||
|
|
|
||
|
|
<!-- Open Graph / Social Media -->
|
||
|
|
<meta property="og:type" content="website">
|
||
|
|
<meta property="og:url" content="<?php echo htmlspecialchars($canonical_url); ?>">
|
||
|
|
<meta property="og:title" content="<?php echo htmlspecialchars($page_title); ?>">
|
||
|
|
<meta property="og:description" content="<?php echo htmlspecialchars($page_description); ?>">
|
||
|
|
|
||
|
|
<!-- Favicon -->
|
||
|
|
<link rel="icon" type="image/x-icon" href="assets/images/favicon.ico">
|
||
|
|
|
||
|
|
<!-- Fonts -->
|
||
|
|
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||
|
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
||
|
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap" rel="stylesheet">
|
||
|
|
|
||
|
|
<!-- Styles -->
|
||
|
|
<link rel="stylesheet" href="assets/css/main.css">
|
||
|
|
|
||
|
|
<style>
|
||
|
|
.quote-hero {
|
||
|
|
padding: 120px 0 60px;
|
||
|
|
background: linear-gradient(135deg, #f5f7fa 0%, #c3cfe2 100%);
|
||
|
|
text-align: center;
|
||
|
|
}
|
||
|
|
|
||
|
|
.quote-form-section {
|
||
|
|
padding: 60px 0;
|
||
|
|
background: white;
|
||
|
|
}
|
||
|
|
|
||
|
|
.quote-form-container {
|
||
|
|
max-width: 800px;
|
||
|
|
margin: 0 auto;
|
||
|
|
background: white;
|
||
|
|
padding: 40px;
|
||
|
|
border-radius: 16px;
|
||
|
|
box-shadow: 0 8px 40px rgba(0, 0, 0, 0.1);
|
||
|
|
}
|
||
|
|
|
||
|
|
.form-row {
|
||
|
|
display: grid;
|
||
|
|
grid-template-columns: 1fr 1fr;
|
||
|
|
gap: 20px;
|
||
|
|
margin-bottom: 24px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.form-step {
|
||
|
|
margin-bottom: 40px;
|
||
|
|
padding-bottom: 40px;
|
||
|
|
border-bottom: 1px solid #e1e5e9;
|
||
|
|
}
|
||
|
|
|
||
|
|
.form-step:last-child {
|
||
|
|
border-bottom: none;
|
||
|
|
margin-bottom: 0;
|
||
|
|
padding-bottom: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
.step-title {
|
||
|
|
font-size: 1.4rem;
|
||
|
|
font-weight: 600;
|
||
|
|
margin-bottom: 16px;
|
||
|
|
color: #1a1a1a;
|
||
|
|
display: flex;
|
||
|
|
align-items: center;
|
||
|
|
gap: 12px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.step-number {
|
||
|
|
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
|
||
|
|
color: white;
|
||
|
|
width: 30px;
|
||
|
|
height: 30px;
|
||
|
|
border-radius: 50%;
|
||
|
|
display: flex;
|
||
|
|
align-items: center;
|
||
|
|
justify-content: center;
|
||
|
|
font-weight: 600;
|
||
|
|
font-size: 0.9rem;
|
||
|
|
}
|
||
|
|
|
||
|
|
.checkbox-group {
|
||
|
|
display: grid;
|
||
|
|
grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
|
||
|
|
gap: 16px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.checkbox-item {
|
||
|
|
display: flex;
|
||
|
|
align-items: center;
|
||
|
|
padding: 12px;
|
||
|
|
border: 2px solid #e1e5e9;
|
||
|
|
border-radius: 8px;
|
||
|
|
cursor: pointer;
|
||
|
|
transition: all 0.3s ease;
|
||
|
|
}
|
||
|
|
|
||
|
|
.checkbox-item:hover {
|
||
|
|
border-color: #667eea;
|
||
|
|
background: #f8f9ff;
|
||
|
|
}
|
||
|
|
|
||
|
|
.checkbox-item input[type="checkbox"] {
|
||
|
|
margin-right: 12px;
|
||
|
|
transform: scale(1.2);
|
||
|
|
}
|
||
|
|
|
||
|
|
.checkbox-item.checked {
|
||
|
|
border-color: #667eea;
|
||
|
|
background: #f8f9ff;
|
||
|
|
}
|
||
|
|
|
||
|
|
.radio-group {
|
||
|
|
display: grid;
|
||
|
|
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
|
||
|
|
gap: 16px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.radio-item {
|
||
|
|
display: flex;
|
||
|
|
align-items: center;
|
||
|
|
padding: 16px;
|
||
|
|
border: 2px solid #e1e5e9;
|
||
|
|
border-radius: 8px;
|
||
|
|
cursor: pointer;
|
||
|
|
transition: all 0.3s ease;
|
||
|
|
}
|
||
|
|
|
||
|
|
.radio-item:hover {
|
||
|
|
border-color: #667eea;
|
||
|
|
background: #f8f9ff;
|
||
|
|
}
|
||
|
|
|
||
|
|
.radio-item input[type="radio"] {
|
||
|
|
margin-right: 12px;
|
||
|
|
transform: scale(1.2);
|
||
|
|
}
|
||
|
|
|
||
|
|
.radio-item.checked {
|
||
|
|
border-color: #667eea;
|
||
|
|
background: #f8f9ff;
|
||
|
|
}
|
||
|
|
|
||
|
|
.quote-summary {
|
||
|
|
background: #f8f9fa;
|
||
|
|
padding: 30px;
|
||
|
|
border-radius: 12px;
|
||
|
|
margin-top: 40px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.summary-item {
|
||
|
|
display: flex;
|
||
|
|
justify-content: space-between;
|
||
|
|
padding: 12px 0;
|
||
|
|
border-bottom: 1px solid #e1e5e9;
|
||
|
|
}
|
||
|
|
|
||
|
|
.summary-item:last-child {
|
||
|
|
border-bottom: none;
|
||
|
|
font-weight: 600;
|
||
|
|
font-size: 1.2rem;
|
||
|
|
color: #667eea;
|
||
|
|
}
|
||
|
|
|
||
|
|
@media (max-width: 768px) {
|
||
|
|
.form-row {
|
||
|
|
grid-template-columns: 1fr;
|
||
|
|
}
|
||
|
|
|
||
|
|
.checkbox-group,
|
||
|
|
.radio-group {
|
||
|
|
grid-template-columns: 1fr;
|
||
|
|
}
|
||
|
|
|
||
|
|
.quote-form-container {
|
||
|
|
padding: 30px 20px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</style>
|
||
|
|
</head>
|
||
|
|
<body>
|
||
|
|
<!-- Navigation -->
|
||
|
|
<nav class="navbar" id="navbar">
|
||
|
|
<div class="nav-container">
|
||
|
|
<div class="nav-logo">
|
||
|
|
<a href="/">
|
||
|
|
<img src="assets/images/logo.svg" alt="UK Data Services" class="logo">
|
||
|
|
</a>
|
||
|
|
</div>
|
||
|
|
<div class="nav-menu" id="nav-menu">
|
||
|
|
<a href="/" class="nav-link">Home</a>
|
||
|
|
<a href="/#services" class="nav-link">Services</a>
|
||
|
|
<a href="/#process" class="nav-link">Process</a>
|
||
|
|
<a href="/#why-us" class="nav-link">Why Choose Us</a>
|
||
|
|
<a href="/#contact" class="nav-link">Contact</a>
|
||
|
|
<a href="quote.php" class="nav-link cta-button">Get Quote</a>
|
||
|
|
</div>
|
||
|
|
<div class="nav-toggle" id="nav-toggle">
|
||
|
|
<span class="bar"></span>
|
||
|
|
<span class="bar"></span>
|
||
|
|
<span class="bar"></span>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</nav>
|
||
|
|
|
||
|
|
<!-- Quote Hero -->
|
||
|
|
<section class="quote-hero">
|
||
|
|
<div class="container">
|
||
|
|
<h1>Get Your Free Data Solutions Quote</h1>
|
||
|
|
<p>Tell us about your project and we'll provide a detailed proposal within 24 hours</p>
|
||
|
|
</div>
|
||
|
|
</section>
|
||
|
|
|
||
|
|
<!-- Quote Form -->
|
||
|
|
<section class="quote-form-section">
|
||
|
|
<div class="container">
|
||
|
|
<div class="quote-form-container">
|
||
|
|
<form id="quote-form" action="quote-handler.php" method="POST">
|
||
|
|
<!-- Step 1: Project Type -->
|
||
|
|
<div class="form-step">
|
||
|
|
<div class="step-title">
|
||
|
|
<span class="step-number">1</span>
|
||
|
|
What type of data services do you need?
|
||
|
|
</div>
|
||
|
|
<div class="checkbox-group">
|
||
|
|
<label class="checkbox-item">
|
||
|
|
<input type="checkbox" name="services[]" value="web-scraping">
|
||
|
|
<span>Web Scraping & Data Extraction</span>
|
||
|
|
</label>
|
||
|
|
<label class="checkbox-item">
|
||
|
|
<input type="checkbox" name="services[]" value="business-intelligence">
|
||
|
|
<span>Business Intelligence & Analytics</span>
|
||
|
|
</label>
|
||
|
|
<label class="checkbox-item">
|
||
|
|
<input type="checkbox" name="services[]" value="data-processing">
|
||
|
|
<span>Data Processing & Cleaning</span>
|
||
|
|
</label>
|
||
|
|
<label class="checkbox-item">
|
||
|
|
<input type="checkbox" name="services[]" value="automation">
|
||
|
|
<span>Automation & APIs</span>
|
||
|
|
</label>
|
||
|
|
<label class="checkbox-item">
|
||
|
|
<input type="checkbox" name="services[]" value="consulting">
|
||
|
|
<span>Custom Development</span>
|
||
|
|
</label>
|
||
|
|
<label class="checkbox-item">
|
||
|
|
<input type="checkbox" name="services[]" value="other">
|
||
|
|
<span>Other (please specify below)</span>
|
||
|
|
</label>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<!-- Step 2: Project Scale -->
|
||
|
|
<div class="form-step">
|
||
|
|
<div class="step-title">
|
||
|
|
<span class="step-number">2</span>
|
||
|
|
What's the scale of your project?
|
||
|
|
</div>
|
||
|
|
<div class="radio-group">
|
||
|
|
<label class="radio-item">
|
||
|
|
<input type="radio" name="project_scale" value="small">
|
||
|
|
<div>
|
||
|
|
<strong>Small Project</strong><br>
|
||
|
|
<small>One-time extraction, < 10k records</small>
|
||
|
|
</div>
|
||
|
|
</label>
|
||
|
|
<label class="radio-item">
|
||
|
|
<input type="radio" name="project_scale" value="medium">
|
||
|
|
<div>
|
||
|
|
<strong>Medium Project</strong><br>
|
||
|
|
<small>Regular updates, 10k-100k records</small>
|
||
|
|
</div>
|
||
|
|
</label>
|
||
|
|
<label class="radio-item">
|
||
|
|
<input type="radio" name="project_scale" value="large">
|
||
|
|
<div>
|
||
|
|
<strong>Large Project</strong><br>
|
||
|
|
<small>Ongoing service, 100k+ records</small>
|
||
|
|
</div>
|
||
|
|
</label>
|
||
|
|
<label class="radio-item">
|
||
|
|
<input type="radio" name="project_scale" value="enterprise">
|
||
|
|
<div>
|
||
|
|
<strong>Enterprise</strong><br>
|
||
|
|
<small>Complex multi-source solution</small>
|
||
|
|
</div>
|
||
|
|
</label>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<!-- Step 3: Timeline -->
|
||
|
|
<div class="form-step">
|
||
|
|
<div class="step-title">
|
||
|
|
<span class="step-number">3</span>
|
||
|
|
When do you need this completed?
|
||
|
|
</div>
|
||
|
|
<div class="radio-group">
|
||
|
|
<label class="radio-item">
|
||
|
|
<input type="radio" name="timeline" value="asap">
|
||
|
|
<span>ASAP (Rush job)</span>
|
||
|
|
</label>
|
||
|
|
<label class="radio-item">
|
||
|
|
<input type="radio" name="timeline" value="1-week">
|
||
|
|
<span>Within 1 week</span>
|
||
|
|
</label>
|
||
|
|
<label class="radio-item">
|
||
|
|
<input type="radio" name="timeline" value="2-4-weeks">
|
||
|
|
<span>2-4 weeks</span>
|
||
|
|
</label>
|
||
|
|
<label class="radio-item">
|
||
|
|
<input type="radio" name="timeline" value="flexible">
|
||
|
|
<span>Flexible timeline</span>
|
||
|
|
</label>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<!-- Step 4: Contact Information -->
|
||
|
|
<div class="form-step">
|
||
|
|
<div class="step-title">
|
||
|
|
<span class="step-number">4</span>
|
||
|
|
Your contact information
|
||
|
|
</div>
|
||
|
|
<div class="form-row">
|
||
|
|
<div class="form-group">
|
||
|
|
<label for="quote-name">Full Name *</label>
|
||
|
|
<input type="text" id="quote-name" name="name" required>
|
||
|
|
</div>
|
||
|
|
<div class="form-group">
|
||
|
|
<label for="quote-email">Email Address *</label>
|
||
|
|
<input type="email" id="quote-email" name="email" required>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="form-row">
|
||
|
|
<div class="form-group">
|
||
|
|
<label for="quote-company">Company</label>
|
||
|
|
<input type="text" id="quote-company" name="company">
|
||
|
|
</div>
|
||
|
|
<div class="form-group">
|
||
|
|
<label for="quote-phone">Phone Number</label>
|
||
|
|
<input type="tel" id="quote-phone" name="phone">
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<!-- Step 5: Project Details -->
|
||
|
|
<div class="form-step">
|
||
|
|
<div class="step-title">
|
||
|
|
<span class="step-number">5</span>
|
||
|
|
Project details
|
||
|
|
</div>
|
||
|
|
<div class="form-group">
|
||
|
|
<label for="quote-sources">Data Sources (websites, APIs, databases)</label>
|
||
|
|
<textarea id="quote-sources" name="data_sources" rows="3" placeholder="Please list the websites, APIs, or data sources you need us to work with..."></textarea>
|
||
|
|
</div>
|
||
|
|
<div class="form-group">
|
||
|
|
<label for="quote-requirements">Detailed Requirements *</label>
|
||
|
|
<textarea id="quote-requirements" name="requirements" rows="5" required placeholder="Please describe your project in detail: what data you need, how you plan to use it, any specific format requirements, delivery preferences, etc."></textarea>
|
||
|
|
</div>
|
||
|
|
<div class="form-group">
|
||
|
|
<label for="quote-budget">Estimated Budget Range (Optional)</label>
|
||
|
|
<select id="quote-budget" name="budget">
|
||
|
|
<option value="">Select budget range...</option>
|
||
|
|
<option value="under-1k">Under £1,000</option>
|
||
|
|
<option value="1k-5k">£1,000 - £5,000</option>
|
||
|
|
<option value="5k-10k">£5,000 - £10,000</option>
|
||
|
|
<option value="10k-25k">£10,000 - £25,000</option>
|
||
|
|
<option value="25k-50k">£25,000 - £50,000</option>
|
||
|
|
<option value="50k-plus">£50,000+</option>
|
||
|
|
<option value="discuss">Let's discuss</option>
|
||
|
|
</select>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<!-- Submit -->
|
||
|
|
<button type="submit" class="btn btn-primary btn-full">Get My Free Quote</button>
|
||
|
|
</form>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</section>
|
||
|
|
|
||
|
|
<!-- Footer -->
|
||
|
|
<footer class="footer">
|
||
|
|
<div class="container">
|
||
|
|
<div class="footer-content">
|
||
|
|
<div class="footer-section">
|
||
|
|
<div class="footer-logo">
|
||
|
|
<img src="assets/images/logo-white.svg" alt="UK Data Services">
|
||
|
|
</div>
|
||
|
|
<p>Professional data solutions for modern businesses. Transform your operations with accurate, actionable insights.</p>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="footer-section">
|
||
|
|
<h3>Services</h3>
|
||
|
|
<ul>
|
||
|
|
<li><a href="/#services">Web Scraping</a></li>
|
||
|
|
<li><a href="/#services">Business Intelligence</a></li>
|
||
|
|
<li><a href="/#services">Data Processing</a></li>
|
||
|
|
<li><a href="/#services">API Development</a></li>
|
||
|
|
<li><a href="/#services">Custom Development</a></li>
|
||
|
|
</ul>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="footer-section">
|
||
|
|
<h3>Company</h3>
|
||
|
|
<ul>
|
||
|
|
<li><a href="/">Home</a></li>
|
||
|
|
<li><a href="quote.php">Get Quote</a></li>
|
||
|
|
<li><a href="/#contact">Contact</a></li>
|
||
|
|
</ul>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="footer-section">
|
||
|
|
<h3>Contact</h3>
|
||
|
|
<ul>
|
||
|
|
<li>Phone: +44 1692 689150</li>
|
||
|
|
<li>Email: info@ukdataservices.co.uk</li>
|
||
|
|
<li>Service Area: UK & International</li>
|
||
|
|
</ul>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="footer-bottom">
|
||
|
|
<p>© <?php echo date('Y'); ?> UK Data Services. All rights reserved.</p>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</footer>
|
||
|
|
|
||
|
|
<!-- Scripts -->
|
||
|
|
<script src="assets/js/main.js"></script>
|
||
|
|
<script>
|
||
|
|
// Enhanced quote form functionality
|
||
|
|
document.addEventListener('DOMContentLoaded', function() {
|
||
|
|
const checkboxItems = document.querySelectorAll('.checkbox-item');
|
||
|
|
const radioItems = document.querySelectorAll('.radio-item');
|
||
|
|
|
||
|
|
// Handle checkbox styling
|
||
|
|
checkboxItems.forEach(item => {
|
||
|
|
const checkbox = item.querySelector('input[type="checkbox"]');
|
||
|
|
checkbox.addEventListener('change', function() {
|
||
|
|
if (this.checked) {
|
||
|
|
item.classList.add('checked');
|
||
|
|
} else {
|
||
|
|
item.classList.remove('checked');
|
||
|
|
}
|
||
|
|
});
|
||
|
|
});
|
||
|
|
|
||
|
|
// Handle radio button styling
|
||
|
|
radioItems.forEach(item => {
|
||
|
|
const radio = item.querySelector('input[type="radio"]');
|
||
|
|
radio.addEventListener('change', function() {
|
||
|
|
// Remove checked class from all items in the same group
|
||
|
|
const groupName = this.name;
|
||
|
|
document.querySelectorAll(`input[name="${groupName}"]`).forEach(r => {
|
||
|
|
r.closest('.radio-item').classList.remove('checked');
|
||
|
|
});
|
||
|
|
|
||
|
|
// Add checked class to selected item
|
||
|
|
if (this.checked) {
|
||
|
|
item.classList.add('checked');
|
||
|
|
}
|
||
|
|
});
|
||
|
|
});
|
||
|
|
|
||
|
|
// Form submission
|
||
|
|
const quoteForm = document.getElementById('quote-form');
|
||
|
|
quoteForm.addEventListener('submit', function(e) {
|
||
|
|
e.preventDefault();
|
||
|
|
|
||
|
|
// Validate form
|
||
|
|
const services = document.querySelectorAll('input[name="services[]"]:checked');
|
||
|
|
const projectScale = document.querySelector('input[name="project_scale"]:checked');
|
||
|
|
const timeline = document.querySelector('input[name="timeline"]:checked');
|
||
|
|
const name = document.getElementById('quote-name').value.trim();
|
||
|
|
const email = document.getElementById('quote-email').value.trim();
|
||
|
|
const requirements = document.getElementById('quote-requirements').value.trim();
|
||
|
|
|
||
|
|
let errors = [];
|
||
|
|
|
||
|
|
if (services.length === 0) {
|
||
|
|
errors.push('Please select at least one service');
|
||
|
|
}
|
||
|
|
|
||
|
|
if (!projectScale) {
|
||
|
|
errors.push('Please select a project scale');
|
||
|
|
}
|
||
|
|
|
||
|
|
if (!timeline) {
|
||
|
|
errors.push('Please select a timeline');
|
||
|
|
}
|
||
|
|
|
||
|
|
if (!name || name.length < 2) {
|
||
|
|
errors.push('Please enter your full name');
|
||
|
|
}
|
||
|
|
|
||
|
|
if (!email || !email.includes('@')) {
|
||
|
|
errors.push('Please enter a valid email address');
|
||
|
|
}
|
||
|
|
|
||
|
|
if (!requirements || requirements.length < 20) {
|
||
|
|
errors.push('Please provide detailed project requirements (minimum 20 characters)');
|
||
|
|
}
|
||
|
|
|
||
|
|
if (errors.length > 0) {
|
||
|
|
alert('Please fix the following errors:\n\n' + errors.join('\n'));
|
||
|
|
return;
|
||
|
|
}
|
||
|
|
|
||
|
|
// Submit form
|
||
|
|
const submitButton = this.querySelector('button[type="submit"]');
|
||
|
|
const originalText = submitButton.textContent;
|
||
|
|
submitButton.textContent = 'Sending Quote Request...';
|
||
|
|
submitButton.disabled = true;
|
||
|
|
|
||
|
|
const formData = new FormData(this);
|
||
|
|
|
||
|
|
fetch('quote-handler.php', {
|
||
|
|
method: 'POST',
|
||
|
|
body: formData
|
||
|
|
})
|
||
|
|
.then(response => response.json())
|
||
|
|
.then(data => {
|
||
|
|
if (data.success) {
|
||
|
|
alert('Thank you! Your quote request has been sent. We will get back to you within 24 hours with a detailed proposal.');
|
||
|
|
this.reset();
|
||
|
|
// Reset styling
|
||
|
|
checkboxItems.forEach(item => item.classList.remove('checked'));
|
||
|
|
radioItems.forEach(item => item.classList.remove('checked'));
|
||
|
|
} else {
|
||
|
|
alert('Error: ' + data.message);
|
||
|
|
}
|
||
|
|
})
|
||
|
|
.catch(error => {
|
||
|
|
console.error('Error:', error);
|
||
|
|
alert('There was an error sending your quote request. Please try again or contact us directly.');
|
||
|
|
})
|
||
|
|
.finally(() => {
|
||
|
|
submitButton.textContent = originalText;
|
||
|
|
submitButton.disabled = false;
|
||
|
|
});
|
||
|
|
});
|
||
|
|
});
|
||
|
|
</script>
|
||
|
|
</body>
|
||
|
|
</html>
|