123 lines
5.3 KiB
PHP
123 lines
5.3 KiB
PHP
<!-- 모달 HTML -->
|
|
<div id="index_action_form" class="index_action_form modal fade" tabindex="-1" aria-labelledby="modal_label" aria-hidden="true">
|
|
<div class="modal-dialog modal-lg modal-dialog-centered modal-dialog-scrollable">
|
|
<div class="modal-content">
|
|
<div class="modal-header">
|
|
<h5 class="modal-title" id="modal_label">
|
|
<h4> <?= ICONS['DESKTOP'] ?> <?= $viewDatas['title'] ?> </h4>
|
|
</h5>
|
|
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
|
</div>
|
|
<div class="modal-body" id="modal-body-content">
|
|
<!-- 여기에 동적으로 콘텐츠가 로드됩니다 -->
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal" onClick="window.location.reload()">닫기</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<script>
|
|
const modal = document.getElementById('index_action_form');
|
|
const modalBody = document.getElementById('modal-body-content');
|
|
|
|
// 콘텐츠 로드 함수
|
|
async function loadContent(url) {
|
|
try {
|
|
const response = await fetch(url);
|
|
if (!response.ok) {
|
|
throw new Error(`HTTP 오류! 상태: ${response.status}`);
|
|
}
|
|
const content = await response.text();
|
|
modalBody.innerHTML = content;
|
|
|
|
// 스크립트 로딩 순서 보장 및 실행
|
|
const scripts = modalBody.getElementsByTagName('script');
|
|
for (let script of scripts) {
|
|
if (script.src) {
|
|
await loadScript(script.src); // 외부 스크립트 순차적으로 로드
|
|
} else {
|
|
eval(script.innerHTML); // 인라인 스크립트 실행
|
|
}
|
|
}
|
|
|
|
setupFormSubmission(); // 폼 제출 이벤트 핸들러 재설정
|
|
} catch (error) {
|
|
console.error('콘텐츠 로드 중 오류 발생:', error);
|
|
modalBody.innerHTML = '<p>콘텐츠를 로드하는 중 오류가 발생했습니다. 다시 시도해 주세요.</p>';
|
|
}
|
|
}
|
|
|
|
// 외부 스크립트 동적으로 로드하는 함수
|
|
function loadScript(src) {
|
|
return new Promise((resolve, reject) => {
|
|
const script = document.createElement('script');
|
|
script.src = src;
|
|
script.onload = () => resolve();
|
|
script.onerror = () => reject(new Error(`스크립트 로드 실패: ${src}`));
|
|
document.body.appendChild(script);
|
|
});
|
|
}
|
|
|
|
// 폼 제출 처리
|
|
function setupFormSubmission() {
|
|
const form = modalBody.querySelector('form');
|
|
if (form) {
|
|
form.addEventListener('submit', async (e) => {
|
|
e.preventDefault();
|
|
const formData = new FormData(form);
|
|
try {
|
|
const response = await fetch(form.action, {
|
|
method: 'POST',
|
|
body: formData
|
|
});
|
|
const contentType = response.headers.get("content-type");
|
|
if (contentType && contentType.indexOf("application/json") !== -1) {
|
|
const result = await response.json();
|
|
if (result.success) {
|
|
modalBody.innerHTML = '<p>데이터가 성공적으로 저장되었습니다.</p>';
|
|
setTimeout(() => {
|
|
bootstrap.Modal.getInstance(modal).hide();
|
|
window.location.reload();
|
|
}, 2000);
|
|
} else {
|
|
modalBody.innerHTML = result.html;
|
|
setupFormSubmission(); // 새로운 폼에 대해 다시 이벤트 리스너 설정
|
|
}
|
|
} else {
|
|
const htmlContent = await response.text();
|
|
modalBody.innerHTML = htmlContent;
|
|
|
|
const scripts = modalBody.getElementsByTagName('script');
|
|
for (let script of scripts) {
|
|
eval(script.innerHTML); // 인라인 스크립트 실행
|
|
}
|
|
|
|
setupFormSubmission(); // 새로운 폼에 대해 다시 이벤트 리스너 설정
|
|
}
|
|
} catch (error) {
|
|
console.error('폼 제출 중 오류 발생:', error);
|
|
modalBody.innerHTML = '<p>데이터 저장 중 오류가 발생했습니다. 다시 시도해 주세요.</p>';
|
|
}
|
|
});
|
|
}
|
|
}
|
|
|
|
// 모달 열릴 때 콘텐츠 로딩
|
|
modal.addEventListener('show.bs.modal', (event) => {
|
|
const button = event.relatedTarget;
|
|
const url = button.getAttribute('data-src');
|
|
if (url) {
|
|
loadContent(url);
|
|
} else {
|
|
console.error('data-src 속성이 없습니다.');
|
|
modalBody.innerHTML = '<p>URL을 찾을 수 없습니다. 다시 시도해 주세요.</p>';
|
|
}
|
|
});
|
|
|
|
// 모달 닫힐 때 콘텐츠 초기화
|
|
modal.addEventListener('hidden.bs.modal', () => {
|
|
modalBody.innerHTML = '';
|
|
});
|
|
</script>
|