Portrait Order Form
document.addEventListener(‘DOMContentLoaded’, async () => {
const stripe = Stripe(‘your_publishable_key_here’); // Replace with your Publishable Key
const payButton = document.getElementById(‘payButton’);
payButton.addEventListener(‘click’, async (e) => {
e.preventDefault();
const totalPrice = parseFloat(document.getElementById(‘totalPrice’).textContent.replace(‘€’, ”));
if (totalPrice <= 0) {
alert('Total price must be greater than zero.');
return;
}
try {
// Call the backend to create a payment intent
const response = await fetch('http://localhost:3000/create-payment-intent', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ amount: totalPrice }),
});
const { clientSecret } = await response.json();
// Redirect to Stripe's payment flow
const { error } = await stripe.confirmCardPayment(clientSecret, {
payment_method: {
card: {
// Optionally collect card details here or use pre-built Stripe elements
},
},
});
if (error) {
alert(`Payment failed: ${error.message}`);
} else {
alert('Payment successful! Thank you for your order.');
}
} catch (error) {
console.error('Error:', error);
alert('An error occurred. Please try again.');
}
});
});
