diff --git a/backend/core/templates/payment.html b/backend/core/templates/payment.html index 3dc5a75..a220dca 100644 --- a/backend/core/templates/payment.html +++ b/backend/core/templates/payment.html @@ -26,6 +26,8 @@ @@ -42,14 +44,30 @@ document.addEventListener('DOMContentLoaded', function() { const status = document.getElementById('code-status'); const codeError = document.getElementById('code-error'); const backendError = document.getElementById('backend-error'); + const submitBtn = document.getElementById('submit-btn'); + + function disableBtn() { + submitBtn.disabled = true; + submitBtn.classList.add('opacity-50', 'cursor-not-allowed'); + } + + function enableBtn() { + submitBtn.disabled = false; + submitBtn.classList.remove('opacity-50', 'cursor-not-allowed'); + } + + disableBtn(); input.addEventListener('input', function() { status.innerHTML = ''; codeError.innerHTML = ''; if (backendError) backendError.style.display = 'none'; const code = input.value.trim(); - if (code.length === 0) return; - + if (code.length === 0) { + disableBtn(); + return; + }; + disableBtn(); status.innerHTML = ` @@ -68,13 +86,16 @@ document.addEventListener('DOMContentLoaded', function() { status.innerHTML = ''; if (data.valid) { codeError.innerHTML = '✅ Valid code'; + enableBtn(); } else { codeError.innerHTML = '❌ Invalid code'; + disableBtn(); } }) .catch(() => { status.innerHTML = ''; codeError.innerHTML = '❌ Error checking code'; + disableBtn(); }); }); });