Correct error message in formular

This commit is contained in:
Lars Kusch 2023-01-20 08:49:36 +01:00
parent 1b50175c34
commit 198ef6b191
3 changed files with 37 additions and 23 deletions

View File

@ -33,6 +33,7 @@ class ProcessBACS {
return this; return this;
}; };
payment_data;
handle = () => { handle = () => {
@ -44,15 +45,6 @@ class ProcessBACS {
location.href=document.querySelector('meta[name=stripe-redirect-url]').content; location.href=document.querySelector('meta[name=stripe-redirect-url]').content;
});} });}
else{ else{
Array.from(
document.getElementsByClassName('toggle-payment-with-token')
).forEach((element) =>
element.addEventListener('click', (element) => {
document.querySelector('input[name=token]').value =
element.target.dataset.token;
})
);
document.getElementById('pay-now').addEventListener('click', (e) => { document.getElementById('pay-now').addEventListener('click', (e) => {
let payNowButton = document.getElementById('pay-now'); let payNowButton = document.getElementById('pay-now');
this.payNowButton = payNowButton; this.payNowButton = payNowButton;
@ -61,8 +53,24 @@ class ProcessBACS {
this.payNowButton.querySelector('span').classList.add('hidden'); this.payNowButton.querySelector('span').classList.add('hidden');
document.getElementById('server-response').submit(); document.getElementById('server-response').submit();
}); });
}
}; this.payment_data = Array.from(document.getElementsByClassName('toggle-payment-with-token'));
if (this.payment_data.length() > 0){
this.payment_data.forEach((element) =>
element.addEventListener('click', (element) => {
document.querySelector('input[name=token]').value =
element.target.dataset.token;
})
);}
else{
this.errors.textContent = "Please add a payment method first, before trying to pay the invoice.";
this.payNowButton.disabled = false;
this.payNowButton.querySelector('span').classList.remove('hidden');
this.payNowButton.querySelector('svg').classList.add('hidden');
}}
}
} }
const publishableKey = document.querySelector( const publishableKey = document.querySelector(

View File

@ -33,6 +33,7 @@ class ProcessBACS {
return this; return this;
}; };
payment_data;
handle = () => { handle = () => {
@ -44,15 +45,6 @@ class ProcessBACS {
location.href=document.querySelector('meta[name=stripe-redirect-url]').content; location.href=document.querySelector('meta[name=stripe-redirect-url]').content;
});} });}
else{ else{
Array.from(
document.getElementsByClassName('toggle-payment-with-token')
).forEach((element) =>
element.addEventListener('click', (element) => {
document.querySelector('input[name=token]').value =
element.target.dataset.token;
})
);
document.getElementById('pay-now').addEventListener('click', (e) => { document.getElementById('pay-now').addEventListener('click', (e) => {
let payNowButton = document.getElementById('pay-now'); let payNowButton = document.getElementById('pay-now');
this.payNowButton = payNowButton; this.payNowButton = payNowButton;
@ -61,8 +53,24 @@ class ProcessBACS {
this.payNowButton.querySelector('span').classList.add('hidden'); this.payNowButton.querySelector('span').classList.add('hidden');
document.getElementById('server-response').submit(); document.getElementById('server-response').submit();
}); });
this.payment_data = Array.from(document.getElementsByClassName('toggle-payment-with-token'));
if (this.payment_data.length() > 0){
this.payment_data.forEach((element) =>
element.addEventListener('click', (element) => {
document.querySelector('input[name=token]').value =
element.target.dataset.token;
})
);}
else{
this.errors.textContent = "Please add a payment method first, before trying to pay the invoice.";
this.payNowButton.disabled = false;
this.payNowButton.querySelector('span').classList.remove('hidden');
this.payNowButton.querySelector('svg').classList.add('hidden');
}}
} }
};
} }
const publishableKey = document.querySelector( const publishableKey = document.querySelector(

View File

@ -37,8 +37,6 @@
<span class="ml-1 cursor-pointer">**** {{ $token->meta?->last4 }}</span> <span class="ml-1 cursor-pointer">**** {{ $token->meta?->last4 }}</span>
</label> </label>
@endforeach @endforeach
@else
<label class="alert alert-failure mb-4">Please add a payment method first.</label>
@endisset @endisset
@endcomponent @endcomponent