dwd-projects
/
holywisdompublicschool.com
generated from dwd/boilarplate-astro-tailwind
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

s1

pull/2/head
dev2 siliconpin 2024-07-01 11:08:19 +00:00
parent d094ff89d8
commit 7b514fa08c
2 changed files with 147 additions and 38 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

105
src/pages/contact.astro
View File

@ -64,50 +64,89 @@ import Layout from "../layouts/Layout.astro";
</main>
</Layout>
<script is:inline>
document.addEventListener('DOMContentLoaded', function () {
const contactForm = document.getElementById('contactForm');
const formSection = document.getElementById('formSection');
const thankYouSection = document.getElementById('thankYouSection');
const nameInput = document.getElementById('name');
const emailInput = document.getElementById('email');
const phoneInput = document.getElementById('phone');
const messageInput = document.getElementById('message');
contactForm.addEventListener('submit', async function (event) {
document.getElementById('formSection').addEventListener('submit', function(event) {
event.preventDefault();
let data = {
data:{
name: nameInput.value,
phone: phoneInput.value,
email: emailInput.value,
message: messageInput.value
const formData = {
data: {
name: document.getElementById('name').value,
phone: document.getElementById('phone').value,
email: document.getElementById('email').value,
message: document.getElementById('message').value
},
owner: "Holly Wisdom Public School",
domain: window.location.origin,
referrer: "Holly Wisdom Public School"
}
console.log("Form Data", data)
const url = 'https://api.siliconpin.com/v3/contact-form-processor/';
try {
const response = await fetch(url, {
owner: 'owner_value',
domain: 'domain_value',
referrer: document.referrer
};
fetch('https://192.168.0.166/v3/contact-form-processor/', {
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify(data)
});
if (response.ok) {
console.log('Form data submitted successfully');
formSection.style.display = 'none';
thankYouSection.style.display = 'block';
body: JSON.stringify(formData)
})
.then(response => response.json())
.then(data => {
if (data.success) {
alert('Data submitted successfully');
} else {
console.error('Failed to submit form data');
}
} catch (error) {
console.error('An error occurred:', error);
alert('Error: ' + data.message);
}
})
.catch(error => {
console.error('Error:', error);
alert('An error occurred while submitting the form');
});
});
// document.addEventListener('DOMContentLoaded', function () {
// const contactForm = document.getElementById('contactForm');
// const formSection = document.getElementById('formSection');
// const thankYouSection = document.getElementById('thankYouSection');
// const nameInput = document.getElementById('name');
// const emailInput = document.getElementById('email');
// const phoneInput = document.getElementById('phone');
// const messageInput = document.getElementById('message');
// contactForm.addEventListener('submit', async function (event) {
// event.preventDefault();
// let data = {
// data:{
// name: nameInput.value,
// phone: phoneInput.value,
// email: emailInput.value,
// message: messageInput.value
// },
// owner: "Holly Wisdom Public School",
// domain: window.location.origin,
// referrer: "Holly Wisdom Public School"
// }
// console.log("Form Data", data)
// const url = 'https://api.siliconpin.com/v3/contact-form-processor/';
// try {
// const response = await fetch(url, {
// method: 'POST',
// headers: {
// 'Content-Type': 'application/json'
// },
// body: JSON.stringify(data)
// });
// if (response.ok) {
// console.log('Form data submitted successfully');
// formSection.style.display = 'none';
// thankYouSection.style.display = 'block';
// } else {
// console.error('Failed to submit form data');
// }
// } catch (error) {
// console.error('An error occurred:', error);
// }
// });
// });
</script>
<style>
.gradintBack {

70
src/pages/tst.astro Normal file
View File

@ -0,0 +1,70 @@
<!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>