fix: prevent double form submission in employee edit form
Problem:
- When editing employee profile, got duplicate PATCH requests
- One request returned 502, another 200 OK
- Error appeared in console but operation succeeded
- Classic double-submit race condition
Root Cause:
initEmployeeForm() added new addEventListener('submit') on every call.
If function was called twice (e.g., on tab navigation or re-render),
two event handlers would fire simultaneously, sending parallel requests.
Solution:
1. Check if form already initialized via data-attribute
2. Set form.dataset.employeeFormInitialized = 'true' flag
3. Skip re-initialization if already initialized
4. Return API object for already initialized forms
This ensures only ONE submit handler per form, preventing:
- Duplicate PATCH requests
- 502 errors from race conditions
- Confusing UX with errors that don't break functionality
Now form submits cleanly with single request.
This commit is contained in:
parent
298524ecc6
commit
b6f1e09ba5
@ -12,7 +12,22 @@ export function initEmployeeForm(options = {}) {
|
||||
return null;
|
||||
}
|
||||
|
||||
// Проверяем, не была ли форма уже инициализирована
|
||||
if (form.dataset.employeeFormInitialized === 'true') {
|
||||
console.warn('[EmployeeForm] Форма уже инициализирована, пропускаем повторную инициализацию');
|
||||
return {
|
||||
setSubmitting: (state) => {
|
||||
const submitBtn = form.querySelector('button[type="submit"]');
|
||||
if (submitBtn) submitBtn.disabled = state;
|
||||
},
|
||||
refresh: () => location.reload()
|
||||
};
|
||||
}
|
||||
|
||||
console.info('[EmployeeForm] Инициализация AJAX обработчика формы');
|
||||
|
||||
// Помечаем форму как инициализированную
|
||||
form.dataset.employeeFormInitialized = 'true';
|
||||
|
||||
// Перехватываем submit формы
|
||||
form.addEventListener('submit', async (e) => {
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user