Исправлена кнопка сохранить в модальном окне создания клиента
Проблема: Обработчик события для кнопки 'Сохранить' был добавлен ДО того, как элемент кнопки появился в DOM. JavaScript пытался найти элемент с id='save-customer-btn' когда его еще не было в HTML, поэтому обработчик никогда не срабатывал. Решение: Переместить код обработчика события в отдельный скрипт, расположенный ПОСЛЕ определения модального окна в HTML (после строки с </div> модала). Это гарантирует, что: 1. HTML элементы уже загружены в DOM 2. JavaScript может найти элемент по id 3. Обработчик события корректно прикрепляется к кнопке Теперь при нажатии на кнопку 'Создать клиента' будет: ✓ Валидирована форма (имя обязательно) ✓ Отправлен AJAX запрос на сервер ✓ Создан новый клиент ✓ Закрыто модальное окно ✓ Выбран созданный клиент в Select2 ✓ Очищена форма 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
@@ -961,72 +961,6 @@ if (typeof $ !== 'undefined') {
|
||||
}
|
||||
});
|
||||
|
||||
// Обработчик сохранения нового клиента
|
||||
document.getElementById('save-customer-btn').addEventListener('click', function() {
|
||||
const name = document.getElementById('customer-name').value.trim();
|
||||
const phone = document.getElementById('customer-phone').value.trim();
|
||||
const email = document.getElementById('customer-email').value.trim();
|
||||
|
||||
// Базовая валидация
|
||||
const errors = [];
|
||||
if (!name) {
|
||||
errors.push('Имя клиента обязательно');
|
||||
}
|
||||
|
||||
if (errors.length > 0) {
|
||||
const errorDiv = document.getElementById('customer-form-errors');
|
||||
errorDiv.innerHTML = '<ul class="mb-0">' + errors.map(e => '<li>' + e + '</li>').join('') + '</ul>';
|
||||
errorDiv.style.display = 'block';
|
||||
return;
|
||||
}
|
||||
|
||||
// Отправляем AJAX запрос
|
||||
fetch('{% url "customers:api-create-customer" %}', {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
'X-CSRFToken': '{{ csrf_token }}'
|
||||
},
|
||||
body: JSON.stringify({
|
||||
name: name,
|
||||
phone: phone || null,
|
||||
email: email || null
|
||||
})
|
||||
})
|
||||
.then(response => response.json())
|
||||
.then(data => {
|
||||
if (data.success) {
|
||||
// Закрываем модальное окно
|
||||
const modal = bootstrap.Modal.getInstance(document.getElementById('createCustomerModal'));
|
||||
modal.hide();
|
||||
|
||||
// Выбираем созданного клиента в Select2
|
||||
const newOption = new Option(data.name, data.id, true, true);
|
||||
$customerSelect.append(newOption).trigger('change');
|
||||
|
||||
// Очищаем форму
|
||||
document.getElementById('customer-name').value = '';
|
||||
document.getElementById('customer-phone').value = '';
|
||||
document.getElementById('customer-email').value = '';
|
||||
document.getElementById('customer-form-errors').innerHTML = '';
|
||||
document.getElementById('customer-form-errors').style.display = 'none';
|
||||
|
||||
// Показываем успешное сообщение
|
||||
alert(`Клиент "${data.name}" успешно создан!`);
|
||||
} else {
|
||||
const errorDiv = document.getElementById('customer-form-errors');
|
||||
errorDiv.innerHTML = '<div class="alert alert-danger mb-0">' + data.error + '</div>';
|
||||
errorDiv.style.display = 'block';
|
||||
}
|
||||
})
|
||||
.catch(error => {
|
||||
console.error('Error:', error);
|
||||
const errorDiv = document.getElementById('customer-form-errors');
|
||||
errorDiv.innerHTML = '<div class="alert alert-danger mb-0">Ошибка при создании клиента: ' + error.message + '</div>';
|
||||
errorDiv.style.display = 'block';
|
||||
});
|
||||
});
|
||||
|
||||
// === ВРЕМЕННЫЕ КОМПЛЕКТЫ ===
|
||||
|
||||
// Модальное окно для создания временного комплекта
|
||||
@@ -1317,6 +1251,75 @@ if (typeof $ !== 'undefined') {
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Обработчик сохранения нового клиента (ДОЛЖЕН быть ПОСЛЕ модального окна в HTML) -->
|
||||
<script>
|
||||
document.getElementById('save-customer-btn').addEventListener('click', function() {
|
||||
const name = document.getElementById('customer-name').value.trim();
|
||||
const phone = document.getElementById('customer-phone').value.trim();
|
||||
const email = document.getElementById('customer-email').value.trim();
|
||||
|
||||
// Базовая валидация
|
||||
const errors = [];
|
||||
if (!name) {
|
||||
errors.push('Имя клиента обязательно');
|
||||
}
|
||||
|
||||
if (errors.length > 0) {
|
||||
const errorDiv = document.getElementById('customer-form-errors');
|
||||
errorDiv.innerHTML = '<ul class="mb-0">' + errors.map(e => '<li>' + e + '</li>').join('') + '</ul>';
|
||||
errorDiv.style.display = 'block';
|
||||
return;
|
||||
}
|
||||
|
||||
// Отправляем AJAX запрос
|
||||
fetch('{% url "customers:api-create-customer" %}', {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
'X-CSRFToken': '{{ csrf_token }}'
|
||||
},
|
||||
body: JSON.stringify({
|
||||
name: name,
|
||||
phone: phone || null,
|
||||
email: email || null
|
||||
})
|
||||
})
|
||||
.then(response => response.json())
|
||||
.then(data => {
|
||||
if (data.success) {
|
||||
// Закрываем модальное окно
|
||||
const modal = bootstrap.Modal.getInstance(document.getElementById('createCustomerModal'));
|
||||
modal.hide();
|
||||
|
||||
// Выбираем созданного клиента в Select2
|
||||
const $customerSelect = $('select[name="customer"]');
|
||||
const newOption = new Option(data.name, data.id, true, true);
|
||||
$customerSelect.append(newOption).trigger('change');
|
||||
|
||||
// Очищаем форму
|
||||
document.getElementById('customer-name').value = '';
|
||||
document.getElementById('customer-phone').value = '';
|
||||
document.getElementById('customer-email').value = '';
|
||||
document.getElementById('customer-form-errors').innerHTML = '';
|
||||
document.getElementById('customer-form-errors').style.display = 'none';
|
||||
|
||||
// Показываем успешное сообщение
|
||||
alert(`Клиент "${data.name}" успешно создан!`);
|
||||
} else {
|
||||
const errorDiv = document.getElementById('customer-form-errors');
|
||||
errorDiv.innerHTML = '<div class="alert alert-danger mb-0">' + data.error + '</div>';
|
||||
errorDiv.style.display = 'block';
|
||||
}
|
||||
})
|
||||
.catch(error => {
|
||||
console.error('Error:', error);
|
||||
const errorDiv = document.getElementById('customer-form-errors');
|
||||
errorDiv.innerHTML = '<div class="alert alert-danger mb-0">Ошибка при создании клиента: ' + error.message + '</div>';
|
||||
errorDiv.style.display = 'block';
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
<!-- Модальное окно для создания временного комплекта -->
|
||||
<div class="modal fade" id="tempKitModal" tabindex="-1" aria-labelledby="tempKitModalLabel" aria-hidden="true">
|
||||
<div class="modal-dialog modal-lg">
|
||||
|
||||
Reference in New Issue
Block a user