generated from dwd/boilarplate-astro-tailwind
71 lines
2.7 KiB
Plaintext
71 lines
2.7 KiB
Plaintext
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Form Submission</title>
|
|
</head>
|
|
<body>
|
|
<form id="formSection">
|
|
<p class="text-2xl py-4">Write your Query</p>
|
|
<div class="pb-3">
|
|
<label for="name">Name:<span class="text-red-500">*</span></label>
|
|
<input id="name" name="name" type="text" placeholder="Enter your Name" required />
|
|
</div>
|
|
<div>
|
|
<label for="phone">Mobile:<span class="text-red-500">*</span></label>
|
|
<input id="phone" name="phone" type="text" placeholder="Enter your Mobile Number" required />
|
|
</div>
|
|
<div class="py-3">
|
|
<label for="email">E-mail ID:<span class="text-red-500">*</span></label>
|
|
<input id="email" name="email" type="email" placeholder="Enter your E-mail ID" required />
|
|
</div>
|
|
<div>
|
|
<label for="message">Write your Query:<span class="text-red-500">*</span></label>
|
|
<textarea id="message" name="message" rows="7" placeholder="Write your Query" required></textarea>
|
|
</div>
|
|
<div>
|
|
<input type="submit" value="Submit" />
|
|
</div>
|
|
</form>
|
|
|
|
<script is:inline>
|
|
document.getElementById('formSection').addEventListener('submit', function(event) {
|
|
event.preventDefault();
|
|
|
|
const formData = {
|
|
data: {
|
|
name: document.getElementById('name').value,
|
|
phone: document.getElementById('phone').value,
|
|
email: document.getElementById('email').value,
|
|
message: document.getElementById('message').value
|
|
},
|
|
owner: 'owner_value', // Replace with appropriate value
|
|
domain: 'domain_value', // Replace with appropriate value
|
|
referrer: document.referrer
|
|
};
|
|
|
|
fetch('your_backend_endpoint', { // Replace with your backend endpoint URL
|
|
method: 'POST',
|
|
headers: {
|
|
'Content-Type': 'application/json'
|
|
},
|
|
body: JSON.stringify(formData)
|
|
})
|
|
.then(response => response.json())
|
|
.then(data => {
|
|
if (data.success) {
|
|
alert('Data submitted successfully');
|
|
} else {
|
|
alert('Error: ' + data.message);
|
|
}
|
|
})
|
|
.catch(error => {
|
|
console.error('Error:', error);
|
|
alert('An error occurred while submitting the form');
|
|
});
|
|
});
|
|
</script>
|
|
</body>
|
|
</html>
|