ruslan/Stend_mont
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix submit forms: use getElementById instead of stale closures, fix texts

Browse Source
This commit is contained in:
Ruslan
2026-05-14 06:52:20 +00:00
parent a60279ae3e
commit d65b7a0d35
1 changed files with 55 additions and 49 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/templates/login.html
+55 -49
View File
@@ -193,11 +193,19 @@
} }
async function submitForm() { async function submitForm() {
const name = document.getElementById('am-name').value.trim(); const nameEl = document.getElementById('am-name');
const company = document.getElementById('am-company').value.trim(); const companyEl = document.getElementById('am-company');
const email = document.getElementById('am-email').value.trim(); const emailEl = document.getElementById('am-email');
const phone = document.getElementById('am-phone').value.trim(); const phoneEl = document.getElementById('am-phone');
const manager = document.getElementById('am-manager').value.trim(); const managerEl = document.getElementById('am-manager');
const submitBtn = document.getElementById('am-submit');
const errorEl = document.getElementById('am-error');
const name = nameEl ? nameEl.value.trim() : '';
const company = companyEl ? companyEl.value.trim() : '';
const email = emailEl ? emailEl.value.trim() : '';
const phone = phoneEl ? phoneEl.value.trim() : '';
const manager = managerEl ? managerEl.value.trim() : '';
const checked = [...document.querySelectorAll('#am-products input[type=checkbox]:checked')]; const checked = [...document.querySelectorAll('#am-products input[type=checkbox]:checked')];
const products = checked.map(c => c.value); const products = checked.map(c => c.value);
@@ -205,31 +213,25 @@
const phoneRe = /^[\+\d][\d\s\-\(\)]{6,18}$/; const phoneRe = /^[\+\d][\d\s\-\(\)]{6,18}$/;
const fields = [ const fields = [
{ el: document.getElementById('am-name'), val: name, check: () => !!name, msg: 'Введите имя и фамилию' }, { el: nameEl, check: () => !!name, msg: 'Введите имя и фамилию' },
{ el: document.getElementById('am-company'), val: company, check: () => !!company, msg: 'Введите название компании' }, { el: companyEl, check: () => !!company, msg: 'Введите название компании' },
{ el: document.getElementById('am-email'), val: email, check: () => emailRe.test(email), msg: 'Введите корректный email' }, { el: emailEl, check: () => emailRe.test(email), msg: 'Введите корректный email' },
{ el: document.getElementById('am-phone'), val: phone, check: () => phoneRe.test(phone), msg: 'Введите корректный номер телефона' }, { el: phoneEl, check: () => phoneRe.test(phone), msg: 'Введите корректный номер телефона' },
]; ];
const errors = []; const errors = [];
fields.forEach(f => { fields.forEach(f => {
if (!f.check()) { if (f.el && !f.check()) { f.el.classList.add('am-invalid'); errors.push(f.msg); }
f.el.classList.add('am-invalid'); else if (f.el) f.el.classList.remove('am-invalid');
errors.push(f.msg);
} else {
f.el.classList.remove('am-invalid');
}
}); });
if (errors.length) { if (errors.length) {
errEl.textContent = errors.join(' • '); if (errorEl) { errorEl.textContent = errors.join(' • '); errorEl.style.display = 'block'; }
errEl.style.display = 'block';
return; return;
} }
btnSubmit.disabled = true; if (submitBtn) { submitBtn.disabled = true; submitBtn.textContent = 'Отправка...'; }
btnSubmit.textContent = 'Отправка...'; if (errorEl) errorEl.style.display = 'none';
errEl.style.display = 'none';
try { try {
const res = await fetch('/api/request-access', { const res = await fetch('/api/request-access', {
@@ -241,10 +243,8 @@
const d = await res.json().catch(() => ({})); const d = await res.json().catch(() => ({}));
throw new Error(d.detail || 'Ошибка отправки'); throw new Error(d.detail || 'Ошибка отправки');
} }
btnSubmit.textContent = 'Отправлено!'; const body = document.querySelector('#access-modal .access-modal-body');
// Show success message const footer = document.querySelector('#access-modal .access-modal-footer');
const body = document.querySelector('.access-modal-body');
const footer = document.querySelector('.access-modal-footer');
body.innerHTML = '<div class="am-success-msg">' + body.innerHTML = '<div class="am-success-msg">' +
'<div class="am-success-icon">✓</div>' + '<div class="am-success-icon">✓</div>' +
'<div class="am-success-title">Запрос отправлен</div>' + '<div class="am-success-title">Запрос отправлен</div>' +
@@ -252,10 +252,10 @@
'</div>'; '</div>';
footer.innerHTML = '<button type="button" class="access-btn-cancel" onclick="window._closeAccessModal()">Закрыть</button>'; footer.innerHTML = '<button type="button" class="access-btn-cancel" onclick="window._closeAccessModal()">Закрыть</button>';
} catch(e) { } catch(e) {
errEl.textContent = e.message || 'Ошибка отправки, попробуйте позже'; const eb = document.getElementById('am-error');
errEl.style.display = 'block'; if (eb) { eb.textContent = e.message || 'Ошибка отправки, попробуйте позже'; eb.style.display = 'block'; }
btnSubmit.disabled = false; const sb = document.getElementById('am-submit');
btnSubmit.textContent = 'Запросить доступ'; if (sb) { sb.disabled = false; sb.textContent = 'Запросить доступ'; }
} }
} }
@@ -288,7 +288,7 @@
<div class="access-modal"> <div class="access-modal">
<div class="access-modal-header"> <div class="access-modal-header">
<div class="access-modal-title">Связаться с Русланом</div> <div class="access-modal-title">Связаться с Русланом</div>
<div class="access-modal-sub">Напишите — отвечу в ближайшее время</div>
</div> </div>
<div class="access-modal-body" id="cm-body"> <div class="access-modal-body" id="cm-body">
<div class="access-field"> <div class="access-field">
@@ -357,35 +357,41 @@
window._closeContactModal = closeContact; window._closeContactModal = closeContact;
async function submitContact() { async function submitContact() {
const name = document.getElementById('cm-name').value.trim(); const nameEl = document.getElementById('cm-name');
const email = document.getElementById('cm-email').value.trim(); const emailEl = document.getElementById('cm-email');
const phone = document.getElementById('cm-phone').value.trim(); const phoneEl = document.getElementById('cm-phone');
const text = document.getElementById('cm-text').value.trim(); const textEl = document.getElementById('cm-text');
const submitBtn = document.getElementById('cm-submit');
const errorEl = document.getElementById('cm-error');
const name = nameEl ? nameEl.value.trim() : '';
const email = emailEl ? emailEl.value.trim() : '';
const phone = phoneEl ? phoneEl.value.trim() : '';
const text = textEl ? textEl.value.trim() : '';
const emailRe = /^[^\s@]+@[^\s@]+\.[^\s@]+$/; const emailRe = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
const phoneRe = /^[\+\d][\d\s\-\(\)]{6,18}$/; const phoneRe = /^[\+\d][\d\s\-\(\)]{6,18}$/;
const fields = [ const fields = [
{ el: document.getElementById('cm-name'), check: () => !!name, msg: 'Введите имя' }, { el: nameEl, check: () => !!name, msg: 'Введите имя' },
{ el: document.getElementById('cm-email'), check: () => emailRe.test(email), msg: 'Введите корректный email' }, { el: emailEl, check: () => emailRe.test(email), msg: 'Введите корректный email' },
{ el: document.getElementById('cm-phone'), check: () => phoneRe.test(phone), msg: 'Введите корректный номер телефона' }, { el: phoneEl, check: () => phoneRe.test(phone), msg: 'Введите корректный номер телефона' },
{ el: document.getElementById('cm-text'), check: () => !!text, msg: 'Введите сообщение' }, { el: textEl, check: () => !!text, msg: 'Введите сообщение' },
]; ];
const errors = []; const errors = [];
fields.forEach(f => { fields.forEach(f => {
if (!f.check()) { f.el.classList.add('am-invalid'); errors.push(f.msg); } if (f.el && !f.check()) { f.el.classList.add('am-invalid'); errors.push(f.msg); }
else f.el.classList.remove('am-invalid'); else if (f.el) f.el.classList.remove('am-invalid');
}); });
if (errors.length) { if (errors.length) {
errEl.textContent = errors.join(' • '); if (errorEl) { errorEl.textContent = errors.join(' • '); errorEl.style.display = 'block'; }
errEl.style.display = 'block';
return; return;
} }
btnSubmit.disabled = true; if (submitBtn) { submitBtn.disabled = true; submitBtn.textContent = 'Отправка...'; }
btnSubmit.textContent = 'Отправка...'; if (errorEl) errorEl.style.display = 'none';
errEl.style.display = 'none';
try { try {
const res = await fetch('/api/contact', { const res = await fetch('/api/contact', {
@@ -401,15 +407,15 @@
'<div class="am-success-msg">' + '<div class="am-success-msg">' +
'<div class="am-success-icon">✓</div>' + '<div class="am-success-icon">✓</div>' +
'<div class="am-success-title">Отправлено</div>' + '<div class="am-success-title">Отправлено</div>' +
'<div class="am-success-sub">Сообщение получено — свяжемся с вами в ближайшее время</div>' + '<div class="am-success-sub">Постараюсь ответить в ближайшее время</div>' +
'</div>'; '</div>';
document.getElementById('cm-footer').innerHTML = document.getElementById('cm-footer').innerHTML =
'<button type="button" class="access-btn-cancel" onclick="window._closeContactModal()">Закрыть</button>'; '<button type="button" class="access-btn-cancel" onclick="window._closeContactModal()">Закрыть</button>';
} catch(e) { } catch(e) {
errEl.textContent = e.message || 'Ошибка отправки, попробуйте позже'; const eb = document.getElementById('cm-error');
errEl.style.display = 'block'; if (eb) { eb.textContent = e.message || 'Ошибка отправки, попробуйте позже'; eb.style.display = 'block'; }
btnSubmit.disabled = false; const sb = document.getElementById('cm-submit');
btnSubmit.textContent = 'Отправить'; if (sb) { sb.disabled = false; sb.textContent = 'Отправить'; }
} }
} }