Getting more info abount transaction ad move js partial to js file
This commit is contained in:
@ -4,8 +4,6 @@ const cardMessages = document.getElementById("card-messages");
|
||||
const payButton = document.getElementById("pay-button");
|
||||
const processing = document.getElementById("processing-payment");
|
||||
|
||||
stripe = Stripe('{{.StripePubKey}}');
|
||||
|
||||
function hidePayButton() {
|
||||
payButton.classList.add("d-none");
|
||||
processing.classList.remove("d-none");
|
||||
@ -30,7 +28,7 @@ function showCardSuccess() {
|
||||
cardMessages.innerText = "Trasaction successful";
|
||||
}
|
||||
|
||||
function val(stripe) {
|
||||
function val(api) {
|
||||
let form = document.getElementById("charge_form");
|
||||
|
||||
if (form.checkValidity() === false) {
|
||||
@ -42,7 +40,8 @@ function val(stripe) {
|
||||
form.classList.add("was-validated");
|
||||
hidePayButton();
|
||||
|
||||
let amountToCharge = String(parseFloat(document.getElementById("amount").value));
|
||||
let amountToCharge = document.getElementById("amount").value;
|
||||
console.log(amountToCharge);
|
||||
let payload = {
|
||||
amount: amountToCharge,
|
||||
currency: 'eur',
|
||||
@ -57,7 +56,7 @@ function val(stripe) {
|
||||
body: JSON.stringify(payload),
|
||||
};
|
||||
|
||||
fetch("{{.API}}/api/payment-intent", requestOptions)
|
||||
fetch(api + "/api/payment-intent", requestOptions)
|
||||
.then(response => response.text())
|
||||
.then(response => {
|
||||
let data;
|
||||
@ -79,7 +78,7 @@ function val(stripe) {
|
||||
if (result.paymentIntent.status === "succeeded") {
|
||||
// we have charged the card
|
||||
document.getElementById("payment_intent").value = result.paymentIntent.id;
|
||||
document.getElementById("payment_method").value = result.paymentIntent.payment_method_types[0];
|
||||
document.getElementById("payment_method").value = result.paymentIntent.payment_method;
|
||||
document.getElementById("payment_amount").value = result.paymentIntent.amount;
|
||||
document.getElementById("payment_currency").value = result.paymentIntent.currency;
|
||||
processing.classList.add("d-none");
|
||||
@ -98,32 +97,36 @@ function val(stripe) {
|
||||
});
|
||||
}
|
||||
|
||||
(function () {
|
||||
// create stripe & elements
|
||||
const elements = stripe.elements();
|
||||
const style = {
|
||||
base: {
|
||||
fontSize: '16px',
|
||||
lineHeight: '24px',
|
||||
}
|
||||
};
|
||||
function stripeInit(pubKey) {
|
||||
stripe = Stripe(pubKey);
|
||||
|
||||
// create card entry
|
||||
card = elements.create('card', {
|
||||
style:style,
|
||||
hidePostalCode: true,
|
||||
});
|
||||
card.mount("#card-element");
|
||||
(function () {
|
||||
// create stripe & elements
|
||||
const elements = stripe.elements();
|
||||
const style = {
|
||||
base: {
|
||||
fontSize: '16px',
|
||||
lineHeight: '24px',
|
||||
}
|
||||
};
|
||||
|
||||
// check for input errors
|
||||
card.addEventListener('change', function(event) {
|
||||
var displayError = document.getElementById("card-errors");
|
||||
if (event.error) {
|
||||
displayError.classList.remove('d-none');
|
||||
displayError.textContent = event.error.message;
|
||||
} else {
|
||||
displayError.classList.add('d-none');
|
||||
displayError.textContent = "";
|
||||
}
|
||||
});
|
||||
})();
|
||||
// create card entry
|
||||
card = elements.create('card', {
|
||||
style:style,
|
||||
hidePostalCode: true,
|
||||
});
|
||||
card.mount("#card-element");
|
||||
|
||||
// check for input errors
|
||||
card.addEventListener('change', function(event) {
|
||||
var displayError = document.getElementById("card-errors");
|
||||
if (event.error) {
|
||||
displayError.classList.remove('d-none');
|
||||
displayError.textContent = event.error.message;
|
||||
} else {
|
||||
displayError.classList.add('d-none');
|
||||
displayError.textContent = "";
|
||||
}
|
||||
});
|
||||
})();
|
||||
}
|
||||
|
Reference in New Issue
Block a user